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代步 伐 。 

本 书 是 一 本 绪 合 实战 型 的 新 媒体 美工 设计 教程 ， 除 了 有 理论 知识 的 讲解 之 外 ， 还 
有 各 个 岛 域 实战 案例 的 奔 解 。 如 果 你 准备 加 新 媒体 美工 设计 行业 发 展 ， 那 么 本 书 一 定 
适合 你 。 一 书 在 手 ， 可 以 泣 芒 新 媒体 美工 设计 和 运营 技巧 ， 应有尽有 。 本 书 具 有 如 下 
特 损 。 

e 完整 的 流程 : 帮助 读者 利用 各 种 精美 素材 设计 出 精美 的 作品 ， 详 细 分 析 各 个 案例 

流程 ， 让 您 熟练 擎 担 设计 技巧 ! 

e 热门 的 创意 顶级 创意 ， 随 意 挑选 ， 将 创意 思想 更 加 完美 地 运用 到 新 媒体 美工 页 

面 设计 当中 ， 让 你 的 设计 作品 更 加 优秀 并 更 有 价值 ! 

e 经 典 的 案例 : 大 量 的 品牌 新 媒体 美工 案例 ，30 多 个 优质 实战 案例 设计 并 分 享 全 部 

教程 ， 让 你 的 设计 更 有 意义 ! 

e 行业 范围 广 : 宫 括 房产 、 餐饮 、 汽 车 . 电子 数码 .时 疝 饰 品 . 互联 网 金融 、 新 零售 电 商 、 

网 络 游戏 、 新 闻 资 讯 以 及 在 线 教育 等 行业 ， 总 有 适合 你 的 。 

本 书 博 米 其 他 同类 书籍 的 特色 ， 通 过 这 种 系统 而 著 实 的 讲述 ， 希 望 能 够 为 读者 市 
来 真实 的 运 曹 帮 助 ， 让 读者 零 预 算 也 能 做 出 高 端 大 气 上 档次 的 新 媒体 设计 ， 让 产品 的 
流量 和 转化 暴涨 。 

本 书 汇集 作者 多 年 在 实际 工作 中 总 结 的 宝贵 经 验 ， 从 实战 角度 出 发 ， 人 全面、 系统 
地 进 解 了 新 媒体 美工 的 实战 运用 ， 采 用 商业 案例 与 设计 理念 相 结合 的 万 式 进 行 编写 ， 
系统 地 向 读者 讲解 如 何 科学 合理 、 正 确 有 效 地 进行 新 媒体 内 容 的 设计 。 同 时 ， 本 书 通 
过 大 量 的 案例 剖析 ， 从 “学 以 致 用 ”的 角度 出 帮 ， 讲 解 新 媒体 设计 知识 、 新 媒体 平台 
制作 、 新 媒体 广告 设计 、 新 媒体 文案 排版 以 及 新 媒体 视觉 运营 等 实战 操作 。 

本 书 安排 了 大 量具 有 针对 性 的 实例 ， 并 配 以 详细 的 教学 视频 ， 总计 420 多 分 钟 ， 层 
层 深入 地 讲解 案例 制作 ,帮助 读者 轻松 掌握 软件 的 使 用 技巧 和 具体 应 用 ,做 到 学 以 致 用 。 

本 书 主要 由 叶 龙 编著 ， 参 与 编写 的 人 员 还 有 罗 梦 歼 、 间 胜 璋 、 刘 向 东 、 间 松 异 、 
刘 伟 、 卢 情 、 周 旭 阳 、 喜 淑敏 、 谭 中 阳 、 杨 端阳 、 李 四 华 、 王 力 建 、 柏 承 能 、 刘 桂 化 、 
柏 松 、 谭 贤 、 谭 俊杰 、 徐 匡 、 刘 巡 、 柏 慧 等 人 ,在 此 表示 感谢 。 由 于 作者 知识 水 平 有 限 ， 
书 中 难免 有 玖 漏 之 处 ， 居 请 广大 读者 批评 、 指 正 。 


编 者 


第 1 音 入 门 基础 : 从 零 开 始 了 解 新 媒体 美工 i Ne 1 


44 i ATJSDWEIEKSETIWIEK Qsasuasacaanuaaaccsshipkusasqsšusqakuaasakusa 2 
1 1 2 s. m G SSS aaa asa Dau uN 
了 es 2 
1.1.3 新 媒体 美工 的 岗位 要 求 ………………… suan smaquuksqsapuaquwuqkpaypunaspapacqaqpus 3 

1.2 配色 宝典 : 丰富 多 彩 的 色彩 搭配 ………………………… ER 5 
1.2.1 怎样 定义 主 色调 ee peg 5 
1.21 调和 配色 的 基本 技巧 ooooaaasssssssssssassas ee eT ¿eu 6 
a ee 8 

1.3 版式 设 计 : 新 媒体 美工 版 式 布 局 pp ssssssassansas 9 
1 3 1 版 式 设 计 的 基本 布局 9 
LS KP D KO anasawkapusqaiaqaqia eg Re 12 

1.4 注意 事项 : 新 媒体 界面 的 实用 性 …… smasanaas sanasunnasnananaanaan sssasssasansas 13 
1.4.1 注重 图 片 的 分 辨 率 美 感 .…………… 人 13 
1.4. 切 勿 随意 拉 伸 图 片 和 pp NA PRETO ee 14 

第 2 章 新 媒体 运营 : 元 束 与 图 文 广 告 设 计 ……………… aaaaa as... smsmennananannnna 15 

21 新 媒体 元 素 设 计 ……………… sssusnssunssusnassansassnaasasansansnananaananaas sssasnssnnasan 16 
2.T,1 Dili Lopo KEE, wawaaaayawausqussiwawqaswawawawasawawqawwawsawqanwqaqyauyacsss Fe 
2.1.2 设计 表彰 pp 17 

22 新 媒体 图 文 设计 ……………… NS 人 ne 20 
2.2.1 设计 封面 图 pp i i tessass 330 
0 4 i s K PUTs sss 25 
> 23 设计 九宫 格 图 片 PN 是 D8 
2.2.4 设计 个 人 海报 图 片 pp uqaqa ai Sasa ni 30 


新 媒体 美工 元 全 操作 手册 


第 3 章 朋友 圈 : 朋友 圈 相 册封 面 设 计 pp 35 
34 “日 月 视觉 ”朋友 圈 设 计 ee NN ER 36 
3.1.1 制作 朋友 圈 相 册封 面 背 县 pp a apay miu ha 36 

3.1.2 ”制作 朋友 圈 相 册封 面 头像 38 

3.1.3 ”制作 朋友 圈 相 册封 面 文案 qasaq ST 39 

32  “ 美 协 团队 ”朋友 圈 设 计 ee .… 41 
3.2.1 设计 朋友 圈 封 面 背 最 效果 ...................................................... 42 

i IjEKESIASPP1ADSS was 44 

3.3 SEJBABFEPSI W eak Qsoa 人 aaa 47 

第 4 音 公众 号 : 推 文 广告 与 求 关注 设计 ……………: EN 51 
4.1 公众 号 封面 广告 设计 -................................................................. ... 52 
#4.1.1 DILE DbHBE) ap Es .............. RS i 

4 DHARAN TI VK as eswsawasisawaawawswsasaasawassnqaq 53 
i 56 

4.2 公众 号 内 容 图 片 设 计 .ep TE va 7 
i 58 

4.2.2 制作 内 容 图 片 文字 效果 ....... te Ca SE ibu aa Kau 60 

4.3 公众 号 求 关 注 设 计 --.-..................... sssasnssanssansssasansassasassnanasssasaanaannasa 62 
4.3.1 UPEROUENEIPELSRHE Q¿<sssssscasusasqssss ee 3 

4.3.2 制作 公众 号 求 关 注 主 体 效 时 ................................................... 64 

4.3.3 #HHEBEEIKR37ET IK ......................... ¿sua us T 66 

第 5 章 小 程序 : 界面 广告 以 及 宣传 页 设计 - 0... 本 i 69 
5.1 “ 柴 柴 的 雪 食 旗舰 店 ” 小 程序 设计 eee ROGER mW 
| i 

5.1.2 制作 商品 活动 区 效果 pp | 

5.1.3 ”制作 详情 页 推荐 效果 ee ee ri 

5.2 “去 旅行 ”小 程序 设计 i a .… 81 
5.2.1 制作 横幅 广告 背景 效果 pp i i 8] 

5.2.2 制作 横幅 广告 文字 效果 :pp a a Q2 


C í í í í 


CONTENTS] E] 录 


第 6 章 今日 头条 : 头像 以 及 推送 广告 设计 Tr 85 


6.1 头条 号 头像 设计 pe oo 有 6 
6.1.1 制作 企业 品牌 LOGO 主体 效果 pp i 96 

6.1.2 制作 企业 品牌 LOGO 字符 效果 ……………… 人 02 

6.1.3 制 | 作 企 业 品 牌 LOGO 文字 效果 ce ee................... 有 94 

6.2 头条 推送 广告 设计 ee 97 
6.2.1 制作 推送 广告 背景 效果 ............................. 08 

6.2.2 制作 推送 广告 文字 效果 pp es 99 

第 7 章 一 点 资讯 : 横幅 广告 与 活动 设计 S| 03 
7.1 主页 横幅 广告 设计 ese 104 
7.1.1 制作 主页 横幅 广告 背景 效果 ne i i 104 

7.1.2 制作 主页 横幅 广告 文字 效果 NR 107 

7.2 元旦 活动 广告 设计 pp 109 
7.2.1 制作 商场 折扣 活动 页 面 主 体 效 果 …………… ORO OO PN 109 

7.2.2 制作 商场 折扣 活动 页 面 文字 效果 Q... PT kunqa +e. 4 111 

第 8 章 百度 新 闻 : 图 文 推送 广告 及 促销 活动 设计 ………… ee 115 
本 而 | On ee 116 

8.1.2 制作 广告 封面 主体 效果 sto, ....... 118 

9 1 3 制作 广告 封面 文案 效果 HE 人 121 

8.2 “ 双 十 一 ”促销 活动 页 面 设 计 …… TT "..... 123 
0 154 

8.2.2 制作 “ 双 十 一 ”促销 活动 页 面 文字 效果 ...... OPO ee 125 

= 9= 新 浪 微 博 : 主 图 广告 与 推送 广告 设计 ...... muwnuuwuwumannunaananananan 129 
94 微 博 主 图 广告 设计 22... ....... sn 430 

9 1 1 制作 微 博 主 图 主体 效果 ¿aa guau apuyaya di ee a asus ER 130 

9.1.2 制作 微 博 主 图 文字 效果 ee ] 34 

9.2 微 博 推送 广告 设计 ……………… manssnsssssasssasssasnsssssnsnssnasssss..... ."...... -........ 136 


新 媒体 美工 元 全 操作 手册 


9.2.1 制作 微 博 推 送 广告 背景 效果 pp .... 136 

0 2 2 制作 微 博 推送 广告 文字 效果 站 i 1 3 了 
10.1 知 平 账号 头像 设计 ep ......................................... 42 
10 .1 .1 制作 知 平头 像 背 最 效果 a iqiuwkhal 143 
10.1.2 制作 知 平头 像 主 体 效 果 局 ns Si 144 
10.2 豆瓣 书店 广告 设计 ee PP 150 
10.2.1 制作 豆 准 书店 主体 效果 :pp 和 151 

10 7 9 制作 豆 辩 书店 文字 效果 i qqekayasawnaspakankieq i ] 54 

第 11 章 QQ 空间 : 好 友 动 态 信息 流 广告 设计 ………………………… 459 
11. 雪 食 品牌 推广 活动 设计 pp “ee 60 
11 .1 制作 零食 推广 页 主体 效果 ………… i ee ...]61 
11.2 珠宝 产品 促销 广告 设计 -useesssssssssssslssl...............ssssssssssssss.......... 166 
机 | 制作 产品 页 面 文字 效果 i OE 167 
Il.) 23 制作 产品 页 面 细 节 效 果 CY ry u buyakwakakas rE kupas 169 
12.1 快手 个 人 主页 封面 设计 ………… Tr 174 
12.1.1 制作 个 人 主页 封面 主体 效果 :PN a 174 

J2 j 2 制作 个 人 主页 封面 文字 效果 …… NO see ]77 
12.2 拌 音 平台 个 人 名 片 设 计 ep eeeeoeeeeesseeessesssoe "..... 180 
]2 2 HI RS VG IW 2-7 C Wq, a: a se 18] 

J 9 3 制作 个 人 名 片 主体 效果 ………… NR aaa 182 
12.2.3 制作 个 人 人 名片 文字 效果 :pp ]84 
第 13 齐 音频 平台 : S⁄PS1SIR5SEE S iVEVEESEDIISII ………………: oe 189 
13.1 荔枝 微 课 宣传 页 界面 设计 pp aaaeaaaaaaasaaeaesaa 190 
13.1.1 制作 宣传 页 背景 效果 .ppp i 190 
13.1.3 制作 宣传 页 主体 效果 : rT ee Te ee 192 


CONTENTS El 录 


| 制作 广播 活动 页 背景 效果 人 uuu ua uuu aus 197 

|J3 2.3 制作 广播 活动 页 文字 效果 EE ee NR .900 

第 14 章 直播 平台 : 主播 推广 与 游戏 直播 设计 PE 203 
14.1 YY 主播 横幅 推广 设计 susuunnuusnununanansnassssssssssnssnunassnanasnsanaanananns .... 204 
]A.1.1 制作 横幅 广告 主体 效果 ee PR RN aN TR OREO OR Qa ARAAKA 204 

14.1 2 制作 横幅 广告 文字 效果 a a shao yeh eee Oy eS 205 

14.2 虎牙 游戏 直播 页 面 设 计 susununuusnununaunsannasssunassnssanusunanasn munusunsansunsnannannan 208 
14.2 J 制作 游戏 直播 页 面 主体 效 果 … ER 和 208 

EE 2 3 制作 游戏 直播 页 面 细 节 效 果 :9 人 2]0 

第 15 章 淘宝 网 店 : 店铺 海报 与 详情 装修 设计 ………………………… …213 
15.1 美 妆 网 店 海报 设计 susuunsunsusunnansanasasa mms s 214 
IS j. 制作 纯色 渐变 效果 ee au saa sum ass Saa aaa ee u suu use .… 914 

]J5.1.2 制作 海报 文字 效果 i i 317 

15.2 厨具 网 店 详情 页 设计 soon anonaaseonaeennan en 218 
IS. 2.1 制作 网 店 详情 页 主体 效果 RE 2]9 

]5.2.2 制作 网 店 详情 页 文字 效果 :pp ee eT 220 
第 16 章 天 猫 平 台 : 商场 广告 与 书籍 推广 页 设计 a... 225 
16 .1 天 猫 南 场 广 告 设计 susuusunnsusunnuunsunsssnsssnsunssunsansnnnunsnnnnsunasnsununssnsnasusunan 226 
]J6.] 1 制作 海报 背景 效果 人 RE EN 226 

16.1.2 制作 海报 主体 效果 和 TNR 

16.2 摄影 书籍 推广 页 设计 susuusununusnasnaunuanaunanq suuunus musuunnusunasuasassnasnonununananna 230 
J6.2.1 制作 推广 页 主体 效果 人 a uu aaa u spa s iu aa hu az Se 230 

16.2.2 制作 推广 页 文字 效果 Panaw 站 ¿apas 234 

第 17 = 微 店 平台 : 店铺 广告 与 产品 广告 设计 iii Qhawaq kawan wai kuyiaa 237 
17.1 美食 微 店 广告 设计 susunsunsusunanunan sususuusnssununsnnnusunnuanssnasnsusunssnsnanuunnan 238 
171.1 店 招 主体 制作 效果 OR 238 

区 Ë. 店 招 字体 制作 效果 人 242 

17.2 数码 产品 广告 设计 sn DMM 


| 制作 数码 产品 广告 主体 效果 RN Day i bau al sas se A 5 


新 媒体 美工 元 全 操作 手册 


Ts Si Di m i Lu k i qaqas Bag 248 

17.3 图书 微 店 界面 设计 eee nd 250 
1 3WWEODPOERRO Su l listas ORG 35] 

17.3.2 ”制作 店铺 商品 展示 效果 …… Nat 252 

第 18 音 微 商 平台 : 微 商 朋友 圈 广 告 设 计 …………… na en 255 
18. 潮流 休闲 鞋 广告 设计 -.............................................................. 256 
18.1.1 制作 微 商 朋友 圈 广 告 背景 效果 …………… 站 ee qaqa qaa uu 256 

下 本 本 ES 257 

I8. 1.3. SIPPDSINEAERIP W g Si uuaaiaipasusasaauwaswawasqawsaaysssswayssssa 259 

18.2 ”珠宝 首饰 产品 广告 设计 -.......................................................... 262 
i 263 
| ee Wi oaa 266 

第 19 音 H5 设计 : 婚礼 请 束 与 品牌 推广 设计 ……- A ee 269 
19.1 婚礼 请 过 H5 页 面 设计 --......................................................... 270 
I PERLWSW SE WS Im...U.UULILL II ss eusasausawanasawyawawswawss 270 

19.1.2 Vr [is AE RL........................... nm 

19.2 ”汽车 品牌 推广 H5 页 面 设计 pp 275 
CR Se 

19.2.2 设计 汽车 产品 框架 页 面 效 果 ………………… a 278 

9 2 ME 28] 

第 208 APP 设计 : 活动 海报 和 游戏 宣传 设计 ……………………… 285 
20.4 修 图 APP 活动 海报 设计 ppp i Saga 
a ¿pu S W n n 286 

pe a 288 

20.2 游戏 APP 启动 宣传 页 设计 ppp 291 
20.2.1 制作 游戏 宣传 背 县 效果 ………………… ET 292 

aD. 205 


VIII 


知识 11 j] 


新 媒体 是 一 种 新 的 媒体 形态 ， 它 可 以 同时 间 所 有 人 提供 同样 的 内 容 ， 它 被 
形象 地 称 为 “第 五 媒体 ”。 新 媒体 将 成 为 新 时 代 的 主要 传播 方式 ， 所 以 美化 新 
媒体 界面 的 新 媒体 美工 也 必 将 成 为 热门 职业 。 


本 章 重 点 导航 


基础 认识 : 入 1 门 新 媒体 美工 。 ”9 版 式 设计 : 新 媒体 美工 版 式 
设计 布局 

配色 宝典 : 丰富 多 彩 的 色彩 ” ”9 注意 事项 : 新 媒体 界面 的 实 
es Ru 用 性 
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信人 基础 认识 : 入 门 新 媒体 美工 设计 


新 媒体 将 成 为 新 时 代 的 主要 传播 方式 ， 它 重 塑 了 信息 传播 流程 ， 最 大 限度 地 激发 了 各 行 
各 业 的 生产 各 力 ， 而 且 现 在 互联 网 的 普及 降低 了 信息 发 布 门槛 ， 使 大 众 不 绸 是 单纯 的 信息 接 
收 者 ， 他 们 也 可 以 参与 到 信息 生产 中 ， 并 慢 慢 地 成 为 新 的 信息 传播 者 。 作 为 美化 新 媒体 界面 
的 新 媒体 美工 的 重要 程度 也 不 言 而 喻 。 本 主要 介绍 新 媒体 美工 设计 的 基础 知识 。 


1.1.1 新 媒体 的 运用 | 


新 媒体 是 相对 于 传统 媒体 来 说 的 ， 它 是 一 种 利用 数字 技术 、 网 络 技术 、 移 动 技术 通过 互 
联网 、 无 线 通 信 网 、 有 线 网 络 等 渠道 以 及 电脑 、 手 机 、 数 字 电 视 机 等 终端 ， 四 用 户 提供 信息 
和 娱乐 的 传播 形态 。 

在 整个 互联 网 时 代 ， 电 商 、 广 告 以 及 增值 服务 的 需求 非常 大 ， 借 助 新 媒体 ， 可 以 目 然 地 
连接 起 自 媒 体 和 广告 主 ， 让 前 者 有 收益 、 后 者 有 流量 ， 各 取 所 需 。 

由 于 新 媒体 逐渐 由 热门 转向 火爆 ， 新 媒体 美工 也 应 运 而 生 。 新 媒体 美工 主要 是 对 传播 的 
新 型 媒体 如 朋友 圈 、 公 众 写 、 小 程序 、 头 条 号 、 微 博 以 及 微 店 等 界面 进行 图 片 美化 与 布局 排 
版 的 设计 师 ， 使 其 给 大 众 提 供 更 加 舒适 的 视觉 体验 ， 也 让 信息 更 快捷 地 传递 给 大 众 。 如 图 1-1 
所 示 ， 是 一 些 运 用 新 媒体 美工 技术 设计 的 界面 。 


小 程序 置顶 攻略 ， 下 次 打开 更 方便 。 查看 详情 >> 


1-1 运用 新 媒体 美工 技术 设计 的 部 分 界面 


1.1.2 怎样 成 为 一 个 好 美工 


从 网 络 上 的 点 击 量 来 看 ， 新 媒体 一 直 是 一 个 热门 话题 ,界面 作为 用 户 打开 时 第 一 眼看 到 


入 门 基础 :| 加 
《KX<« 从 堆 开 始 了 解 新 媒体 美工 医 


的 东西 ， 美 观 性 是 很 重要 的 ， 它 的 美观 度 直 接 关 系 到 用 户 是 人 否 会 留 下 来 继续 训 览 界面 中 的 信 
旦 ， 有 所 以 新 媒体 美工 的 作用 是 很 大 的 。 

新 媒体 美工 设计 的 主要 原则 就 古 满 足 企 业 的 需求 。 新 媒体 美工 设计 通 第 要 与 商业 活动 相 
关 ， 要 在 商业 目的 上 做 合适 的 设计 ， 在 设计 过 程 中 ， 一 方面 要 营 握 色彩 搭配 、 网 页 构成 ( 平 
面 构成 以 及 立体 构成 )， 同 时 也 要 兼顾 文案 / Gl. HB. J KUSA pe e l PE, AH 
图 1-2 所 示 。 

新 媒体 美工 设计 的 核心 是 视觉 创意 设计 ， 通 过 视觉 表现 让 各 种 新 媒体 内 容 更 具 冲 击 力 和 
吸引 力 ， 并 引起 用 户 的 关注 和 兴趣 ， 从 而 将 内 容 和 信息 传达 给 他 们 ， 最 终 获 得 用 户 的 点 击 、 
关注 、 转 发 以 及 参与 等 行为 。 


消费 者 心理 


图 1-2 符合 企业 需求 的 新 媒体 美工 技术 
因此 ， 新 媒体 与 美工 设计 具有 极 强 的 互动 关系 ， 虽 然 新 媒体 可 以 更 好 地 传达 设计 者 的 美 
工 创意 理念 ， 同 时 为 他 们 带 来 了 更 加 广阔 的 发 展 空间 ， 新 媒体 也 在 制约 着 美工 设计 ， 但 是 ， 
所 有 的 设计 作品 必须 以 新 媒体 为 渠道 来 传播 ， 这 也 十 新 媒体 美工 获得 快速 发 展 的 原动力 。 


1.1.3 ”新 媒体 美工 的 六 位 要 求 DD 


新 媒体 美工 设计 师 是 互联 网 二 时代 的 “黄金 职业 ”， 前 景 广 ， 就 业 好 ， 薪 资 高 ， 已 成 为 
人 才 市 场 上 十 分 紧 信 的 职业 ， 行 业 前 景 非常 广阔 。 同 时 ， 新 媒体 美工 的 发 展 方向 非常 广 ， 更 
容易 转型 为 网 站 设计 师 、UI 设 计 师 、 产 品 经 理 以 及 平面 设计 等 , 甚至 有 可 能 成 长 为 全 能 设计 师 。 

当然 ， 很 多 企业 对 于 新 媒体 美工 这 个 轩 位 有 一 定 的 要 求 ， 如 图 1-3 所 示 ， 列 举 了 一 些 第 
见 的 疯 位 要 求 。 

另外 ， 新 媒体 美工 设计 人 员 还 需要 学 习 一 些 工 具 的 使 用 方法 ， 如 图 1-4 所 示 。 本 书 将 在 
商业 案例 的 讲解 中 结合 设计 软件 的 使 用 方法 ， 让 读者 不 只 是 单纯 学 软件 操作 ， 更 懂得 设计 软 
件 的 使 用 技巧 与 设计 原理 的 完美 融合 。 
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新 媒体 美工 


五 险 一 全 周末 疯 休 饭 补 


职位 月 薪 : 2001-do00 元 /月 El 工作 地 点 : 烟台 
发 布 日 期 : 最 近 工作 性 质 ; 全 职 
TES: 不 限 最 低 学 历 : 不 限 
招聘 人 数 : 3 人 职位 类 别 ; 平面 设计 


职位 摘 述 


岗位 职责 : 

1、 完 成 微 信 平台 页 面 美化 设计 ， 配 合 内 容 编辑 ， 增 强 文 章 阅 读 感 ; 
2、 根 据 微 信 第 划 的 主题 及 内 容 ， 制 定 插画 风格 ， 设 计 特 色 的 图 画 、 漫 画 、GIF 制 作 ; 
3、 独 立 完成 擂 图 的 创意 手稿 和 成 品 上 作 ， 并 进行 全 程 的 质量 哩 踪 ; 
任职 资格 : 

1、 美 木 院 校 播 画 、 绘 男 等 相关 专业 优先 ; 

、 较 强手 绽 能 力 并 且 能 够 融 练 应 用 手 绽 板 ; 

、 热 爱 绘 画 ， 具 备 优 秀 的 艺术 构思 能 力 和 设计 技巧 ; 

、 熟 缂 使 用 各 种 播 图 相关 软件 和 平面 设计 软件 ; 

)、 较 强 的 创意 、 第 划 能 力 ， 思 维 敏捷 ; 

5. 熟练 使 用 Photoshop 等 常用 设计 制作 软件 ; 

、 应 聘 时 请 务必 提供 个 人 作品 


职位 描述 公司 介绍 


、 公 司 网 页 设计 

、 公 司 新 产品 设计 、 外 包装 设计 以 及 产品 改版 设计 

. 公司 沿 信 平台 各 类 图 片 设 计 

、 公司 品牌 形象 设计 

、 上 级 额 导 交 代 的 其 他 任务 
任职 资格 : 

1、 能 够 独立 完成 设计 工作 ， 并 且 高 效 高 品质 的 展现 
3， 郭 绕 使 用 photoshop 。cozeltanm， ai 等 软件 ， 熟 二 排 片 工作 
3、 平面 设计 、 广 告 创 意 竺 岗位 2 年 以 上 工作 经 验 
4、 认 同 公司 的 运营 模式 和 企业 文化 
5、 工 作 认真 、 踏 实 ， 具有 良好 的 职业 素养 及 职业 道德 
工作 时 间 : 


8:00=-12:00, 13: 30=17: 59 


图 1-3 ”新 妊 体 美工 的 岗位 要 求 


学 习 设 计 原 理 ， 拒 绝 单纯 软件 操作 


Photoshop After Effects [Illustrator InDesign 
图 像 澳 辑 与 合成 电影 视觉 和 动态 图 形 天 量 图 形 和 插图 页 面 设计 和 排版 


HTML5 Fireworks Dreamweaver CSS 
图 像 编 辑 与 合成 网 页 作 图 软件 Web 和 和 格 动 设计 图 像 搬 辑 与 合成 


图 1-4 新 媒体 美工 常用 的 工具 
下 面 根据 58 同城 、 前 程 无 忧 以 及 智联 招聘 等 招聘 平台 实例 ， 总 结 了 一 些 新 媒体 美工 闵 位 
的 具体 要求 。 
(1) 会 用 PS、AI、CDR 等 设计 软件 。 
(2) 完成 微 信 平台 页 面 美化 设计 、 活 动 方案 设计 、VI 设计 、 产 品 LOGO 和 宣传 彩 页 等 。 
(3) 完成 微 信 朋友 圈 及 公众 写 图 片 的 处 理 和 美化 设计 等 ， 对 微 信 公众 号 进行 更 新 及 维护 。 
(4) 负责 微 博 、 微 信 各 种 创意 广告 图 片 、 诲 报 、 宣 传 册 、 画 册 、 促 销 专题 页 面 的 设计 。 
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(5) 活动 海报 的 设计 、 推 广 页 面 的 设计 以 及 企业 宣传 朋 、 产 品 图 册 、 单 页 和 招商 手册 的 制 
作 等 。 

(6) 进行 新 媒体 互动 页 面 的 整体 美工 创意 、 设 计 、 制 作 以 及 美化 。 

(7) 为 网 站 设计 广告 图 片 、 横 幅 及 动画 广告 。 

(8) 协助 各 业务 部 门 制作 PPT 和 产品 演示 版 本 等 。 

(9) 图 片 制作 ， 如 一 年 中 不 同 布 日 主题 的 祝福 图 片 ， 适 用 于 微 信和 表情 的 早晚 问安 及 其 他 主 
题 图 片 ， 简 单 海报 制作 ， 易 企 秀 等 软件 制作 宣传 小 视频 及 邀请 国 等 。 

(10) 负责 微 信 小 程序 产品 的 发 布 与 设计 。 

(11) 根据 微 信 策划 的 主题 及 内 容 ， 设 计 特 色 的 图 画 、 漫 画 以 及 GIF 制作 。 

(12) 负责 微 博 、 微 信 大 型 活动 方案 的 策划 、 创 意 、 执 行 、 运 营 以 及 汇报 和 总 结 。 

(13) 负责 公司 平面 宣传 资料 的 设计 。 

(14) 精通 拍摄 后 期 修 片 流程 工作 ， 熟 练 掌握 PS 和 LR 等 相关 修 图 软件 ， 有 相关 作品 。 

(15) 擅长 微 信 公众 号 平台 的 文案 编辑 ， 提 升 粉 丝 数量 和 增长 量 。 


1.2 配色 宝典 : 丰富 多 彩 的 色彩 搭配 


对 于 看 到 新 媒体 作品 的 用 户 来 说 ， 他 们 首先 会 被 界面 中 的 色彩 所 吸引 ， 然 后 根据 色彩 的 
走向 对 画面 的 主 次 逐一 进行 了 解 。 本 市 主要 对 新 媒体 的 色彩 设计 知识 进行 讲解 ， 这 些 基础 知 
识 也 是 后 期 新 媒体 设计 配色 中 的 关键 所 在 。 


1.2.1 怎样 定义 主 色 调 DD 


在 大 自然 中 ， 我 们 经 常见 到 这 样 一 种 现象 ， 不 同 颜色 的 物体 或 被 苑 单 在 一 片 金色 的 阳光 
之 中 ， 或 被 党 单 在 一 片 轻 纱 溥 雾 般 谈 监 色 的 月 色 之 中 ， 或 被 秋天 迷人 的 金黄 色 所 党 单 ， 或 被 
统一 在 冬季 银 日 色 的 世界 之 中 。 这 种 在 不 同 颜色 的 物体 上 ， 党 单 着 某 一 种 色彩 ， 使 不 同 颜色 
的 物体 都 带 有 同一 色彩 倾 癌 的 色彩 就 是 色调 。 

色调 指 的 是 新 媒体 界面 中 画面 色彩 的 总 体 倾 同 ， 征 大 方 癌 的 色彩 效 采 。 在 新 巡 体 美工 设 
计 的 过 程 中 ， 往 往 会 使 用 多 种 颜色 来 表现 形式 多 样 的 画面 效 末 ， 但 总 体 都 会 持 有 一 种 倾 癌 ， 
古 偏 黄 或 偏 绿 , 古 偏 冷 或 偏 暧 等 , 这 种 颜色 上 的 倾 加 就 是 画面 给 人 的 总 体 印 象 , 如 图 1-5 所 示 。 

色调 是 色彩 运用 中 的 主旋律 ， 是 构成 新 媒体 界面 的 整体 色彩 倾向 ， 也 可 以 称 之 为 “色彩 
的 基调 ”， 画 面 中 的 色调 不 仅仅 古 指 单一 的 色彩 效果 ， 还 是 色彩 与 色彩 直接 相互 关系 中 所 体 
现 的 总 体 特 征 ， 征 色彩 组 合 呈 现 出 的 多 样 、 统 一 的 色彩 倾 癌 。 
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旅行 相册 


我 的 旅行 日 记 


行 至 江南 ， 甩 到 之 人 处 
便 是 满 满 的 水 印象 


悠远 ， 舍 四 

没有 黄河 的 雄厚 ， 没 有 丽江 的 淄 清 人 

只 是 静 静 地 独白 流 着 ， 深 远 着 ; 
r 


图 1-5 不 同色 调 的 新 媒体 美工 设计 


1.2.2 调和 配色 的 基本 技巧 


“ 调 ” 是 调整 、 调 配 、 安排 、 搭配 和 组 合 等 意思 ，“ 和 ”可 理解 为 和 谐 、 融洽 、 恰 当 、 适 宜 、 
有 秩序 、 有 和 条理， 没有 尖锐 的 冲突 ， 相 得 益 彰 等 。 配 色 的 目的 就 是 为 了 制造 美的 色彩 组 合 ， 
而 和 谐 是 色彩 美的 首要 前 提 ， 和 谐 的 色调 让 人 感觉 到 愉悦 ， 同 时 调配 后 的 颜色 还 能 满足 人 们 
视觉 上 的 需求 以 及 心理 上 的 平衡 。 

我 们 知道 ， 和 谐 来 自 对 比 ， 和 谐 就 是 美 。 没 有 对 比 就 没有 刺激 神经 兴奋 的 因素 ， 但 只 有 
兴奋 而 没有 舒适 的 休息 会 造成 过 分 的 疲 芝 会 造成 精神 的 紧张 ， 这 样 调和 也 就 成 了 一 句 空 话 。 
所 以 ， 在 设计 新 媒体 作品 时 ， 既 要 有 对 比 来 产生 和 谐 的 刺激 美 ， 又 要 有 适当 的 调和 来 抑制 过 
分 的 对 比 刺激 ， 从 而 产生 一 种 恰到好处 的 对 比 。 总 体 来 说 ， 色 彩 的 对 比 是 绝对 的 ， 而 调和 是 
相对 的 ， 调 和 是 实现 色彩 美的 重要 手段 。 

1. 与 色相 一 致 的 调和 配色 

在 保证 色相 大 致 不 变 的 前 提 下 ， 通 过 改变 色彩 的 明度 和 纯度 来 获得 配色 的 效果 ， 这 类 配 
色 方 式 保持 了 色相 上 的 一 臻 性， 所 以 色彩 在 整体 效果 上 很 容易 达到 调和 ，。 

例如 ，“ 同 一 色相 配色 ”是 指 相同 的 颜色 在 一 起 的 搭配 方法 ， 比 如 紫色 的 上 衣 配 上 红色 
的 裤子 或 者 裙子 ， 这 样 的 配色 方法 就 是 同一 色相 配色 法 。 如 图 1-6 所 示 ， 画 面 中 海报 的 文字 、 
背景 等 都 使 用 红色 系 进 行 搭配 ， 通 过 明度 的 变化 使 其 产生 强烈 的 对 比 ， 并 使 画面 配色 更 加 丰 
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富 ， 表 现 出 柔和 的 特性 。 


1-6 同一 色相 配色 


2. 与 明度 一 致 的 调和 配色 

明度 是 人 类 分 辨 物体 色彩 景 敏感 的 色彩 反应 ， 它 的 变化 可 以 表现 出 事物 的 立体 感 和 远近 
感 。 如 希腊 的 雕刻 艺术 就 是 通过 光影 的 作用 产生 了 许多 黑白 灰 的 相互 关系 ， 形 成 了 成 就 感 ， 
中 国 的 国画 也 经 常 使 用 无 彩色 的 明度 搭配 。 有 彩色 的 物体 也 会 受到 光影 的 影响 而 产生 明暗 效 
果 ， 如 紫色 和 黄色 就 有 着 明显 的 明度 差 。 

在 新 媒体 设计 中 ， 一 般 都 使 用 明度 相同 、 色 相 和 
纯度 变化 的 配色 方式 。 如 图 1-7 所 示 ， 画 面 中 背景 图 
片 均 为 高 明度 调和 配色 ， 带 给 人 清 夹 、 亮 丽 以 及 非常 
阳光 的 印象 ， 表 现 出 优雅 和 含 著 的 氛围 ， 是 一 组 柔和 
且 明 朗 的 色彩 组 合 方式 ， 非 常 符合 画面 中 女性 凉鞋 的 
特点 。 且 通过 同样 大 小 的 圆 形 字母 来 组 成 主题 文字 ， 
利用 相同 色相 的 不 同 明度 完成 配色 ， 得 到 一 种 安静 的 
视觉 体验 。 

3. 与 纯度 一 致 的 调和 配色 

纯度 的 强 弱 代表 着 色彩 的 鲜 灰 程度 ， 在 一 组 色彩 
中 当 纯度 的 水 平 相对 一 致 时 ， 色 彩 的 搭配 也 就 很 容易 
地 获得 调和 的 效果 ， 并 随 着 纯度 高 低 的 不 同 ， 色 彩 的 
搭配 也 会 给 人 以 不 一 样 的 视觉 感受 。 

4 无 彩色 系列 的 调和 配色 

无 彩色 的 色彩 个 性 并 不 明显 ， 将 无 彩色 与 任何 色彩 搭配 都 可 以 取得 调和 的 色彩 效果 ， 通 
过 无 彩色 与 无 彩色 搭配 ， 可 以 传达 出 一 种 经 典 的 永恒 美感 ， 将 无 彩色 与 有 彩色 搭配 ， 可 以 用 
其 作为 主要 的 色彩 来 调和 色彩 间 的 关系 。 如 图 1-8 所 示 ， 是 由 某 HS 广告 推出 的 一 个 小 游戏 ， 
采用 灰白 黑 三 色 ， 加 上 非常 有 趣 的 画 风 ， 与 “搞笑 ”主题 配合 得 非常 贴切 。 


图 1-7 以 明度 为 基础 的 调和 配色 
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图 1-8 以 纯度 为 基础 的 调和 配色 
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1.2.3 ”如 何 确定 色彩 风格 


对 于 新 媒体 设计 来 说 ， 色 彩 是 最 重要 的 视觉 因素 ， 不 同 的 颜色 代表 不 同 的 情绪 ， 因 此 对 
色彩 的 使 用 应 该 和 设计 的 主题 相 契 合 。 如 图 1-9 所 示 ，“ 狐 了 么 ”小 程序 的 底部 导航 栏 通过 
运用 不 同 颜 色 的 按钮 来 代表 其 激活 状态 ， 使 用 户 快速 知道 目 己 所 处 的 位 置 。 
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专家 指点 


在 新 媒体 美工 设计 中 ,有 时 为 了 获得 茶 种 特殊 的 效果 ， 或 者 凸显 出 某 个 特殊 的 对 象 ， 
可 以 通过 无 彩色 调和 配色 来 对 设计 的 画面 进行 创作 。 

在 新 媒体 界面 的 制作 过 程 中 ， 根 据 色彩 的 特性 ， 通 过 调整 其 色相 、 明 度 以 及 纯度 之 
间 的 对 比 关 系 ， 或 通过 各 色彩 间 面 积 调 和 ， 可 以 搭配 出 变化 无 穷 的 新 媒体 界面 效果。 


13， 版 式 设计 : 新 媒体 美工 版 式 布局 


在 网 店 的 运营 过 程 中 ， 可 以 通过 制作 出 的 美观 、 适 合 商 品 的 页 面 ， 获 得 吸引 顾客 、 提 高 
销售 业绩 的 效果 ， 关 和 键 之 处 就 在 于 装修 设计 的 版 式 布局 。 


1.3.1 版 式 设 计 的 基本 布局 JU 


在 设置 一 个 新 媒体 界面 时 ， 通 常 包含 了 太 多 的 元 素 ， 这 些 元 素 的 布局 没有 固定 的 章法 可 
循 ， 主 要 靠 设 计 师 的 灵活 运用 与 搭配 。 只 有 在 大 量 的 设计 实践 中 熟练 运用 ， 才 能 真正 理解 版 
式 布局 设计 的 形式 原则 并 加 以 运用 ， 从 而 创作 出 优秀 的 新 媒体 广告 作品 。 

1. 对 称 与 均衡 

对 称 又 称 “ 均 齐 ”， 是 在 统一 中 求 变化 ;均衡 则 侧重 在 变化 中 求 统一 。 

对 称 的 图 形 具 有 单纯 、 简 洁 的 美感 以 及 静态 的 安定 感 ， 对 称 可 给 人 以 稳定 、 沉 静 、 端 庄 、 
大 方 的 感觉 ， 产 生 秩序 、 理 性 、 高 贵 、 静 穆 之 美 。 对 称 的 形态 在 视觉 上 有 安定 、 自 然 、 均 匀 、 
协调 、 整 齐 、 典 鸦 、 庄 重 、 完 美的 朴素 美感 ， 符 合 人 们 通常 的 视觉 习惯 。 

均衡 的 形态 设计 让 人 产生 视觉 与 心理 上 的 完美 、 宁 静 、 和 谐 之 感 。 静 态 平衡 的 格局 大 致 
是 由 对 称 与 均衡 的 形式 构成 。 均 衡 结构 是 一 种 自由 稳定 的 结构 形式 ， 一 个 画面 的 均衡 是 指 画 
面 的 上 与 下 、 左 与 右 实 现 面积 、 色 彩 、 重 量 等 的 大 体 平 衡 。 

在 画面 上 ， 对 称 与 均衡 产生 的 视觉 效果 是 不 同 的 ， 前 者 端庄 静 称 ， 有 统一 感 、 格 律 感 ， 
但 如 过 分 均等 就 容易 显 呆板 ， 后 者 生动 活泼 , 有 运动 感 , 但 有 时 因 变 化 过 强 而 容易 失衡 。 因此 ， 
在 设计 中 要 注意 把 对 称 、 均 衡 两 种 形式 有 机 地 结合 起 来 灵活 运用 ， 如 图 1-10 所 示 。 

2. 节奏 与 韵律 

节奏 与 韵律 是 物质 运动 的 一 种 周期 性 表现 形式 ， 是 有 规律 的 重复 、 有 组 织 的 变化 现象 ， 
是 艺术 造型 中 求 得 整体 统一 和 变化 ， 从 而 形成 艺术 感染 力 的 一 种 表现 形式 。 韵 律 是 通过 节奏 
的 变化 来 产生 的 ， 对 于 版 面 来 说 ， 只 有 在 组 织 上 符合 某 种 规律 并 具有 一 定 的 节奏 感 ， 才 能 形 
成 基 种 韵律 。 

在 新 媒体 美工 设计 中 ， 合 理 运 用 节奏 与 韵律 ， 才 能 将 复杂 的 信息 以 轻松 、 优 雅 的 形式 表 
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现 出 来 。 如 图 1-11 所 示 ， 古 “手机 构图 摄影 大 全 ”公众 号 中 的 几 张 构图 图 片 ， 几 人 条 荷花 的 色 
彩 和 布局 统一 ， 相 同形 式 的 构图 体现 出 画面 的 韵律 感 ， 而 每 个 画面 中 的 文字 形态 和 内 容 各 不 
相同 ， 这 样 又 表现 出 节奏 上 的 变化 ， 让 读者 阅读 起 来 更 加 轻松 。 


该 商品 的 详情 页 面 中 使 
用 左右 对 称 的 形式 进行 
设计 ， 但 不 古 绝对 的 对 
称 ， 画 面 中 的 布局 在 基 
本 元 素 的 安排 上 赋予 固 
定 的 变化 ， 对 称 均衡 ， 
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图 1-10 对称 与 均衡 的 布局 表现 形式 


更 灵活 、 更 生动 ， 是 设 
计 中 较为 第 用 的 表现 手 
段 , 具 有 现代 感 的 特征 ， 
也 让 画面 中 的 商品 细 市 
与 文字 搭配 显得 更 自然 
和 谐 。 


《上 喘 日 荷花 别 样 美 》 
【构图 】 : 以 拍 ， 申 心 析 图 


‘小 荷 才 露 尖 尖 角 ， 


【 构图 】 => heap 蝇 深 构图 


[和 解说】: 

小 荷 才 霜 尖 央 角 ， 早 有 晴 嫣 立 上 污 

1、 三 分 线 构 图 : 将 主角 小 荷 秆 于 克 向 右 三 分 贱 位 置 。。 koya 
2、 九 官 格 构 图 : 将 主角 晴 账 置 于 九宫 格 右 上 单 点 。 
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图 1-11 ”节奏 与 韵律 的 版 面 布局 表现 形式 
3. 对 比 与 调和 


从 文字 含义 上 分 析 ， 对 比 与 调和 有 是 一 对 充满 矛盾 的 综合 体 ， 但 它们 实质 上 却 又 征 相 辅 相 
成 的 统一 体 。 在 新 媒体 广告 设计 中 ， 画 面 中 的 各 种 设计 元 素 都 存在 着 相互 对 比 的 关系 ， 但 为 
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了 找到 视 沉 和 心理 上 的 平衡 ， 设 计 师 往往 会 在 不 断 的 对 比 中 寻求 能 够 相互 协调 的 因素 ， 让 画 
面 同时 具备 变数 和 和 谐 的 审 去 情趣 。 

对 比 : 对 比 是 指 差异 性 的 强调 。 对 比 的 因素 存在 于 相同 或 相 异 的 性 质 之 间 ， 也 就 是 把 相 
对 的 两 要 素 互 相 比较 之 下 ， 产 生 大 小 、 明 上 暗 、 丢 日 、 强 弱 、 粗 细 、 玻 密 、 高 低 、 远 近 、 动 静 、 
轻重 等 对 比 关系 。 对 比 的 最 基本 要 素 是 显示 主 从 关系 和 统一 变化 的 效果 ， 如 图 1-12 所 示 。 

调和 : 调和 和 是 指 适 合 、 和 舒适 、 安 定 、 统 一 ， 征 近似 性 的 强调 ， 征 两 者 或 两 者 以 上 的 要 素 
之 间 基 有 的 共性 ， 如 图 1-13 所 示 。 

对 比 与 调和 和 古 相 辅 相 成 的 ， 在 新 媒体 海报 的 版 面 构成 中 ， 一 般 整体 版 面 宜 采用 调和 ， 局 
部 版 面 宜 采 用 对 比 。 
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图 1-12 对 比 布局 的 表现 形式 图 1-13 调和 布局 的 表现 形式 


4. 重复 与 交错 


在 网 店 的 版 面 布局 中 ， 往 往 不 断 重 复 使 用 相同 的 基本 形象 ， 它 们 的 形状 、 大 小 、 方 回 都 
征 相 同 的 。 重 复 能 使 设计 产生 安定 、 整 齐 、 规 律 的 统一 。 

但 重复 构成 后 的 视觉 感受 有 时 容易 显得 呆板 、 平 谈 ， 缺 乏 趣 味 性 ， 因 此 ， 我 们 在 版 面 中 
可 安排 一 些 交 错 与 重 登 ， 以 打破 版 面 呆板 、 平 痰 的 格局 。 

S. 虚实 与 留 白 

虚实 与 留 日 古 新 媒体 版 面 设计 中 重要 的 视觉 传达 手段 ， 主 要 用 于 为 版 面 增 添 灵气 和 制造 
空间 感 。 两 者 部 是 采用 对 比 与 衬托 的 方式 将 版 面 中 的 主体 部 分 烘托 出 来 ， 使 版 面 结构 主 次 更 
加 请 上 晰 ， 同 时 也 能 使 碑 面 更 具 层 次 感 。 

留 日 是 版 面 中 未 放置 任何 图 文 的 空间 ， 它 是 “ 虚 ” 的 特殊 表现 手法 。 其 形式 、 大 小 、 比 
例 决定 着 版 面 的 质量 。 留 日 给 和 人 的 感觉 征 轻 松 的 ， 最 大 的 作用 征 引 人 注意 。 在 排版 设计 中 ， 
巧妙 地 留 日 , 讲究 空白 之 美 , 是 为 了 更 好 地 衬托 主题 、 集 中 视线 和 造成 版 面 的 空间 层次 。 例 如 ， 
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魅 可 产品 的 美 妆 海报 设计 留 白 ， 如 图 1-14 所 示 。 
在 版 面 中 巧妙 地 留 出 空白 区 域 ， 使 留 白 空间 更 好 地 
衬托 主体 ， 将 读者 视线 集中 在 画面 主题 之 上 。 留 白 的 手 
法 在 版 式 设计 中 运用 广泛 ， 可 使 版 面 更 富 空 间 感 ， 给 人 
丰富 的 想象 空间 。 >Š 
任何 形体 都 具有 一 定 的 实体 空间 ， 而 在 形体 之 外 或 "upan 
形体 背后 呈现 的 细弱 或 膀胱 的 文字 、 图 形 和 色彩 就 是 虚 | Er s. 
的 空间 。 实 体 空 间 与 虚 的 空间 之 间 设 有 绝对 的 分 界 ， 画 
面 中 每 一 个 形体 在 占据 一 定 的 实体 空间 后 ， 常 常 需要 利 
用 一 定 的 虚 的 空间 来 获得 视觉 上 的 动态 与 扩张 感 。 版 面 81444 ” 贸 白 的 版 面 布局 表现 形式 
虚实 相生 ， 主 体 得 以 强调 ， 画 面 更 具 连 贯 性 。 


1.3.2 图 片 布局 的 技巧 L) 


在 新 媒体 界面 设计 的 过 程 中 ， 图 片 是 除了 文字 外 的 另 一 个 重要 的 传递 信息 途径 ， 也 是 网 
络 销售 和 微 营 销 中 最 需要 重点 设计 的 一 个 设计 元 素 。 图 片 比 文字 的 表现 力 更 直接 、 更 快捷 、 
更 形象 、 更 有 效 ， 可 以 让 信息 传递 更 简洁。 

1. 裁剪 抠 图 ， 提 炼 精华 

在 设计 新 媒体 界面 时 ， 大 部 分 图 片 都 是 由 摄影 师 拍 摄 的 ， 它 们 在 表现 形式 上 大 都 症 固定 
不 变 的 ， 或 在 内 容 上 只 有 一 部 分 符合 装修 需要 ， 此 时 就 需要 裁剪 图 片 或 者 对 图 片 进 行 抠 图 处 
理 ， 使 它们 更 符合 版 面 设计 的 需求 。 例 如 ， 卡 西欧 手表 的 询 宝 主 图 设计 ， 如 图 1-15 所 示 。 
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1-15 抠 图 并 重新 布局 商品 图 片 


2. 缩放 图 片 ， 组 合 布 局 
对 于 同一 种 商品 照片 的 布局 设计 来 说 ， 如 有 进行 不 同比 例 的 缩放 ， 也 会 获得 不 同 的 视 完 
效果 ， 从 而 凸显 出 不 同 的 重点 。 
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入 门 基础 Eš 
的 从 零 开 始 了 解 新 媒体 美工 六 


如 图 1-16 所 示 ， 为 某 女 鞋 的 详情 页 ， 在 处 理 图 片 的 过 程 中 ， 通 过 实 拍 照片 展示 商品 的 整 
体 效 果 ， 同 显 出 商品 的 外 形 特点 ， 让 顾客 对 商品 的 注意 力 更 加 集中 。 同 时 ， 将 图 片 进行 缩放 ， 
展示 出 商品 的 细节 ， 让 顾客 对 商品 的 材质 了 解 得 更 清楚 ， 真 实地 还 原 商品 的 质感 ， 更 容易 获 
得 顾客 的 认可 ， 给 人 逼真 的 触感 。 

需要 注意 的 是 ， 新 媒体 界面 设计 与 普通 的 网 页 设计 不 同 ， 它 需要 重点 展示 的 是 商品 本 身 ， 
并 宣传 商家 的 理念 ， 因 此 ， 在 设计 过 程 中 ， 可 以 适当 地 对 商品 图 像 进 行 遮盖 ， 可 以 让 商品 的 
特点 得 以 凸显 ， 从 而 获 时 顾客 更 多 的 关注 。 

如 图 1-17 所 示 ， 画 面 中 通过 将 手机 产品 图 形 抠 取出 来 ， 并 适当 地 旋转 隐藏 部 分 图 像 ， 使 
主体 商品 在 背景 中 显得 轮廓 更 清晰 、 醒 目 而 获得 一 个 对 称 的 效果 。 
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图 1-16 缩放 图 片 进行 组 合 布局 图 1-17 适当 地 旋转 隐藏 部 分 商品 图 像 


1.4 注意 事项 : 新 媒体 界面 的 实用 性 


除了 用 美观 来 吸引 用 户外 ,新 媒体 界面 还 必须 具备 一 定 的 实用 性 , 要 不 然 就 成 了 一 个 “ 花 
架子 ”， 用 户 也 许 会 查看 它 ， 但 查看 后 发 现 并 不 实用 很 可 能 就 会 立即 退出 。 

实用 性 主要 体现 在 : 是 否 能 为 用 户 带 来 较 好 的 操作 和 控制 体验 、 重 要 的 信息 在 界面 中 ， 
能 人 否 得 到 直观 的 展示 和 功能 设 定 契 否 向 单 明 f 2, 


1.4.1 ”注重 图 片 的 分 辨 率 美感 JU 


在 新 媒体 设计 中 ， 图 片 的 品质 与 分 辨 率 有 很 大 的 关系 ， 较 高 的 分 辨 率 可 以 让 图 片 显得 更 
加 清晰 、 精 美 ， 能 够 体现 出 图 片 的 内 在 质感 ， 如 图 1-18 所 示 。 当 然 ， 图 片 如 末 非 常 模糊 ， 品 
质 较 差 ， 那 么 肯定 会 影响 用 户 的 视觉 欣赏 体验 ， 降 低 用 户 对 界面 的 好 感度 ， 如 图 1-19 所 示 。 


新 媒体 美工 ` m. sa >> 
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图 1-18 高 分 辩 率 图 像 图 1-19” 低 分 辨 率 图 像 


1.4.2 切 勿 随意 拉 伸 图 片 


在 设计 新 媒体 界面 中 的 图 像 时 ， 如 果 随 意 拉 伸 图 片 ， 会 造成 图 片 失真 、 变 形 ， 不 但 看 上 
去 感觉 很 奇怪 ,而且 还 会 让 用 户 质疑 设计 者 的 专业 性 ， 如 图 1-20、 图 1-21 所 示 。 
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图 1-20 原 图 图 1-21 ”随意 拉 伸 的 图 片 


因此 ， 用 户 在 处 理 图 像 时 ， 应 该 按照 等 比 缩放 或 者 合理 裁剪 的 原则 来 控制 图 片 的 尺寸 ， 
避免 出 现 随意 拉 伸 的 情况 ， 保 持 图 像 的 真实 感 。 
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图 片 和 文字 是 商家 进行 新 媒体 运营 时 的 主要 武器 ， 一 张 合适 的 图 片 与 有 二 


货 技 巧 的 文章 ， 可 以 吸引 更 多 的 人 来 天 注 。 好 的 图 文 设 计 能 给 新 媒体 的 读者 市 
来 居 悦 的 视 部 效果， 也 能 有 效 地 提高 平台 的 知名 度 。 


本 章 重 点 导航 
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@ 新 妹 体 图 文 设 计 
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这 张 照 请， 半 竟 用 了 哪些 构图 ? 
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2.1 新 媒体 元 北 设计 


在 新 媒体 时 代 ， 各 类 信息 都 争先 念 后 想 要 进入 消费 者 的 眼中 。 图 片 信息 相对 于 其 他 信忠 
更 有 优势 ， 而 且 丰 富 的 颜色 可 以 让 人 第 一 眼 就 关注 到 它 ， 运 用 适当 的 技巧 来 设计 你 的 图 片 ， 
可 以 让 你 的 文章 更 加 出 彩 。 本 证 主要 介绍 一 些 新 媒体 的 元 素 设计 方法 。 


2.1.1 设计 LOGO 标志 | 
LOGO 是 徽标 或 者 商标 的 外 语 缩写 ， 是 LOGOtype 的 缩写 ， 它 的 存在 ， 可 以 使 拥有 此 商 

标的 公司 能 更 好 地 被 识别 与 推广 ， 并 且 通 过 形象 的 商标 ， 可 以 让 消费 者 记 住 公司 主体 和 品牌 

文化 。 下 面 以 “ 创 客 贴 ”为 例 ， 介 绍 制作 LOGO 标志 的 方法 。 

新 建 一 个 空白 的 LOGO 模板 图 像 , 单 击 “ 素 材 分 类 区 ” 的“ 图形” 按钮 , 展开 “图 

形 ” 面 板 ， 在 其 中 选择 相应 图 形 ， 图 形 将 显示 在 画笔 中 央 ， 如 图 2-1 所 示 。 


图 2-1 显示 图 形 


适当 缩小 并 旋转 图 像 ， 移 至 合适 的 位 置 ， 单 击 “ 设 计 操 作 区 ”上 方 的 “复制 ” 
按钮 复制 图 形 ， 如 图 2-2 所 示 ， 旋 转 图 像 ， 移 至 合适 的 位 置 ， 如 图 2-3 所 示 。 


图 2-2 复制 图 形 图 2-3 旋转 并 移动 图 形 
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新 媒体 运营 . Ë 
¿<<< << 元 素 与 图 文 广告 设计 和 


用 与 上 相同 的 方法 制作 出 其 他 图 形 , 如 图 2-4 所 示 。 选 择 最 上 方 的 图 形 , 单 击 “ 设 
计 操 作 区 ”上 方 的 颜色 方块 , 在 弹出 的 列表 框 中 选择 合适 的 颜色 , 更 改 图 形 颜色 ,如 图 2-5 所 示 。 

单 击 “文字 "按钮 ,切换 至 相应 选项 区 , 单 击 左上 方 的 “添加 标题 文字 "按钮 。“ 设 
计 操 作 区 ”将 出 现 一 个 文本 框 , 如 图 2-6 所 示 。 修 改 相应 文本 , 为 其 设置 不 同 的 格式 , 如 图 2-7 
所 示 ， 即 可 完成 LOGO 设计 。 
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图 2-6 ”出现 文本 框 图 2-7 修改 相应 文本 


2.1.2 设计 表单 | 


表单 在 各 大 新 媒体 平台 中 主要 人 负责 数据 采集 ， 如 调查 问卷 、 投 票 等 ， 它 一 般 作为 一 个 有 
目的 的 调研 活动 ， 所 以 表单 质量 尤为 重要 。 设 计 表 单 主要 应 该 考虑 并 明确 两 个 问题 ， 一 是 表 
单 的 主题 ， 二 是 通过 表单 可 以 获得 的 信息 ， 明 确 了 这 两 个 问题 后 ， 还 需要 尽量 体现 在 表单 的 
选项 中 ， 确 保 通 过 表单 中 所 有 的 选项 得 出 来 的 结果 ， 可 以 回答 之 前 的 两 个 问题 ， 则 这 份 表单 
就 是 合格 的 。 

麦客 CRM 是 一 款 免费 的 用 来 对 用 户 信 息 进 行 收集 、 管 理 以 及 拓展 新 用 户 的 轻 态 表单 工 
有 具 , 用户 可 以 自己 轻松 设计 表单 ,收集 结构 化 数据 , 轻松 进行 数据 管理 。 下面 以 麦客 CRM 为 例 ， 
介绍 制作 表单 的 方法 。 
进入 麦客 CRM 首页 ， 按 提示 注册 登录 后 ， 单 击 网 站 顶部 的 “表单 ”按钮 ， 切 
换 至 相应 界面 ， 单 击 右 上 方 的 “创建 表单 ”按钮 ， 如 图 2-8 所 示 ， 弹 出 相应 对 话 框 。 用 户 可 
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新 媒体 美工 下 me >>>>> 


以 选择 “空白 模板 ”选项 , 新 建 一 个 空白 表单 , 完全 由 目 己 编辑 , 也 可 以 选择 “开始 设计 表单 ” 
选项 ， 如 图 2-9 所 示 。 


图 2-8 单 击 “ 创 建 表 单 ”按钮 


在 右 侧 的 模板 区 中 选取 合适 的 模板 ， 并 单 击 “ 预 览 ” 按 钮 ， 确 认 后 ， 单 击 界面 
右 下 方 的 “使 用 此 模板 ”按钮 ， 如 图 2-10 所 示 。 

即 可 应 用 此 模板 ， 进 入 表单 编辑 界面 ， 界 面 左 侧 的 “基础 类 组 件 ” 选 项 区 中 包 
含 了 表单 常用 的 各 种 组 件 ， 右 侧 的 “设置 / 外 观 ” 选 项 区 中 则 主要 是 对 整个 表单 进行 设置 ， 
包括 外 观 与 表单 提交 等 , 在 下 方 的 “主题 " 选项 区 中 可 以 具体 设置 表单 的 外 观 , 如 图 2-11 所 示 。 


通辽 傈 种 渠道 了 解 到 这 次 活动 ? 
盲 方 网 站 


对 本 次 酒 动 总 体 油 是 层 如 何 ? 


有 和 慎 冬 其 他 反 铺 二 对 我 们 说 的 喝 ? 


得 店 漆 血 度 轴 瘟 


图 2-10 单 击 “使 用 此 模板 ”按钮 

单 击 表 头 文字 ， 右 侧 会 出 现 “ 文 本 描述 ”对 话 框 ， 在 此 对 话 框 中 可 以 编辑 表 头 
的 文本 内 容 ， 如 图 2-12 所 示 。 单 击 问卷 题目 ， 右 侧 的 对 话 框 中 会 显示 问题 与 选项 ， 在 此 可 以 
编辑 问题 与 选项 的 内 容 , 选项 可 以 根据 需要 增加 或 减少 。 单 击 右上 角 的 “预览 按钮 , 如 图 2-13 
所 示 。 

预览 编辑 后 的 表单 效 末 ， 检 村 是 否 还 有 需要 改进 的 地 方 ， 确 认 无 误 后 ， 单 击 右 
上 角 的 “关闭 预览 ”按钮 ， 如 图 2-14 所 示 ， 返 回 表 单 编辑 界面 。 单 击 寞 面 底部 的 “提交 ” 按 
zH, 如 图 2-15 所 示 。 
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图 2-11 表单 编辑 界面 
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图 2-12 编辑 表 头 的 文本 内 容 
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图 2-14 单 击 “ 关 闭 预 痪 ”按钮 
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图 2-15 单 击 “ 提 交 ” 按 钮 


完全 操作 手册 


EZ. 06 弹出 相应 界面 ， 单 击 “ 发 布 表 单 ”按钮 ， 如 图 2-16 所 示 ， 即 可 发 布 表单 并 生 
成 链接 。 用 户 可 以 将 链接 发 布 到 各 大 新 媒体 平台 ， 如 图 2-17 所 示 。 


新 的 表单 


一 切 就 绪 ,可 以 发 布 ! 


图 2-16 单 击 “ 发 布 表单 ”按钮 图 2-17 和 后 成 表单 链接 


2.2 新 媒体 图 文 设计 


图 文 式 的 新 媒体 内 容 ， 其 实 就 是 指 图 片 跟 文字 相 结 合 ， 一 篇 文章 中 有 图 片 也 有 文字 的 内 
容 形式 。 图 文 式 形式 能 让 文章 要 表达 的 内 容 主 旨 更 鲜明 ， 同 时 读者 的 阅读 体验 感 也 会 上 升 。 
只 有 一 张 好 的 图 片 才能 与 符合 主题 的 文案 结合 在 一 起 吸引 读者 的 注意 力 。 本 十 主要 介绍 一 些 
新 媒体 的 图 文 设计 方法 。 


2.2.1 设计 封面 图 


通常 来 说 ， 封 面 图 往往 是 读者 看 到 的 第 一 张 图 片 ， 它 是 否 能 吸引 读者 ， 是 读者 点 开 链 接 、 
了 解 链 接 详情 的 重要 因素 。 

如 图 2-18 所 示 ， 为 手机 摄影 构图 大 全 公众 三 的 文章 封面 ， 该 公众 三 以 摄影 构图 为 主 ， 所 
以 图 片 是 一 张 张 非常 精美 的 摄影 作品 ， 吸 引 着 爱好 摄影 的 朋友 驻足 ， 并 点 击 查 看 是 否 还 有 更 
多 精美 的 图 片 。 

了 解 封面 图 片 的 重要 性 之 后 ， 可 以 开始 尝试 制作 封面 图 ， 下 面 以 创 客 贴 为 例 ， 介 绍 制 作 
封面 图 的 方法 。 创 客 贴 是 一 于 非常 便 单 的 在 线 平面 设计 工具 ， 它 不 需要 下 载 客 己 问 ， 可 以 直 
接 在 训 览 右 中 编辑 ， 此 平台 提供 了 大 量 的 模板 与 图 片 素材 ， 只 要 简单 地 拖 动 就 可 以 轻松 地 所 
作出 精美 的 图 片 。 

进入 创 客 贴 首页 , 单 击 “ 开 局 设计 按钮， 进入 模板 挑选 页 面 ， 如 图 2-19 所 示 。 
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新 媒体 运营 . Ë 
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各 类 模板 根据 使 用 的 场景 不 同 进 行 划 分 ,每 个 类 别 又 以 不 同 平台 和 尺寸 来 划分 ， 
选择 好 喜欢 的 模板 后 ,按照 提示 登录 , 即 可 进入 设计 页 面 ， 如 图 2-20 所 示 ， 此 处 选择 的 是 “ 官 
方 公众 号 首 图 ”中 的 一 个 模板 ， 页 面 的 左 侧 是 “素材 分 类 区 ”， 中 间 是 “设计 操作 区 ”, £ 
侧 则 是 “页 面 管理 区 , 


G ull a ll 28.7K/s 17:22 Ei W = 25% C E Gunl 4G nll OK/s 17:24 


《 ”手机 摄影 构图 大 全 < ”手机 摄影 构图 大 全 


§ 月 17 日 中 午 12:10 


今天 ， 你 来 命名 和 构图 ! 


2) 构图 大 师 。 ”直播 教程 影 图 书 


手机 海报 朋友 图 邀请 图 官方 公众 与 首 图 


图 2-19 ”模板 挑选 页 面 


图 2-20 ”设计 页 面 
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首先 可 以 修改 文字 信息 ， 双 击 文 字 ， 即 可 修改 文本 内 容 ， 修 改 时 ， 文 字 会 变 成 
导体 ， 修 改 完毕 后 ， 将 鼠标 光标 移 至 方 框 外 单 击 ， 即 可 应 用 修改 ， 字 体 也 会 变 成 模板 原来 使 
用 的 字体 。 

如 琳 对 字体 格式 不 满意 ， 可 以 在 “设计 操作 区 ”上方 修改 相应 的 格式 ， 包 括 文 
字 颜 色 、 字 体 、 字 号 、 样 式 、 对 齐 方式 、 字 间距 、 行 间距 、 透 明度 、 复 制 、 删 除 等 。 或 者 单 
击 左 侧 的 “文字 ” 按钮, 可 以 在 其 中 挑选 字体 模板 ,只 需 单 击 选择 的 字体 , 字体 就 会 出 现在 “ 设 
计 操 作 区 ”中 央 ， 再 修改 文字 信息 即 可 ， 如 图 2-21 所 示 。 
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图 2-21 修改 文本 内 容 


2 805 然后 再 修改 背景 图 片 ， 单 击 背 景 ， 图 片 变 为 可 编辑 状态 ， 可 在 左 侧 “ 背 景 ” 中 
挑选 纯色 、 纹 理 或 渐变 背景 ， 如 图 2-22 所 示 。 

也 可 以 使 用 一 些 图 片 来 作为 背景 ， 单 击 左 侧 “素材 ”中 的 “图 片 ”按钮 ， 即 可 
显示 大 量 图 片 ， 用 户 可 以 从 中 挑选 喜欢 的 图 片 作 为 背景 ， 如 图 2-23 所 示 。 
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图 2-23 图 片 素材 界面 
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如 果 想 用 自己 已 有 的 图 片 ， 可 以 单 击 左 侧 的 “上 传 图 片 ” 按 钮 ,用 电脑 或 者 
手机 上 传 图 片 ， 上 传 完 成 后 图 片 会 显示 在 左 侧 ， 单 击 上 传 的 图 片 ， 即 可 汪 加 到 “设计 操作 
区 ”。 调 整 图 片 的 位 置 与 大 小 ， 再 根据 需要 调整 其 他 元 素 的 位 置 ， 即 可 完成 设计 ， 如 图 2-24 
所 示 。 


图 2-24 ”调整 背景 
当 有 新 的 元 素 添 加 至 “设计 操作 区 ”时 ， 会 直接 嫩 加 在 最 上 方 ， 如 果 要 将 新 元 
素 放 置 底层 的 话 ， 可 以 单 击 “设计 操作 区 ”右上 方 的 “图 层 ”按钮 ， 在 弹出 的 列表 框 中 可 以 
设置 新 元 素 的 图 层 顺 序 ， 如 图 2-25 所 示 。 


图 2-25 移动 图 层 列表 框 


如 果 觉 得 画面 较 空 ,也 可 以 试 着 添加 一 些 其 他 的 元 素 ， 如 线条 、 形 状 、 图 标 等 ， 
挑选 一 些 元 素 进行 适当 的 组 合 ， 如 图 2-26 所 示 。 如 果 已 经 确定 主题 ， 也 可 以 直接 在 搜索 框 中 
搜索 关键 词 ， 即 可 跳出 很 多 相关 内 容 ， 如 图 2-27 所 示 。 

制作 完成 后 ， 可 以 单 击 “ 设 计 操作 区 ”下 方 的 预览 按钮 ， 对 封面 图 进行 预览， 
看 标题 是 否 会 遮挡 住 封面 图 的 信息 ， 如 图 2-28 所 示 。 但 需要 注意 的 是 ， 只 有 在 编辑 微 信封 面 
图 时 才能 预览。 
确认 无 误 后 ,选择 界面 左上 方 的 “文件 ” | “保存 ”命令 , 即 可 将 文件 保存 到 “ 设 
计 管 理 ”， 方 便 以 后 再 次 调用 ， 如 图 2-29 所 示 。 
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图 2-26 “素材 ”界面 图 2-27 “检索 ”界面 


图 2-28 预 昂 微 信封 面 图 


点 击 此 处 设置 作品 名 称 


起 ”成功 保存 设计 到 设计 管理 


当前 尺寸 为 : 900px* 500px 


图 2-29 ”你 存 封 面 图 
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EZ312] 完成 后 可 以 下 载 图 片 保存 到 电脑 ， 单 击 右 上 方 的 “下 载 ”按钮 ， 即 可 弹出 “下 
载 作 品 ” 对 话 框 。 设 置 需要 的 图 片 格式 后 ， 单 击 “ 确 认 下 载 ” 按 钮 ， 如 图 2-30 所 示 。 


保存 至 公众 号 ”也 发 布 分 享 。 < 下 载 


图 2-30 ”下 载 封面 图 


如 末 想 要 将 目 己 的 作品 分 至 到 其 他 平台 ， 单 击 右上 方 的 “发 布 分 享 ” 按 钮 即 可 
弹出 “分 享 设计 ”对 话 框 ， 并 生成 图 片 链接 ， 复 制 链接 发 布 到 其 他 平台 ,或 者 直接 分 享 至 对 
be P Jy pop 2 MN 23160, 


保存 至 公众 号 Q 发 布 分 字 ¿ 下 载 


图 2-31 分 享 封面 图 


2.2.2 ”设计 信息 长 图 


信息 图 原本 是 新 闻 编 辑 用 来 对 一 个 新 闻 事件 的 过 程 进 行 解读 的 图 片 ， 但 是 因 现 在 移动 用 
户 的 增加 ， 使 一 张 图 片 已 经 容纳 不 下 所 有 的 信息 ， 信 息 长 图 由 此 而 生 ， 如 图 2-32 所 示 。 

信息 长 图 可 以 直接 用 软件 设计 ， 也 可 以 设计 多 张 小 图 后 拼接 起 来 ， 变 成 一 张 长 图 。 下 面 
以 创 客 贴 为 例 ， 介 绍 制作 信息 长 图 的 方法 。 

以 直接 使 用 模板 设计 信息 长 图 为 例 ， 挑 选 好 模板 后 ， 单 击 进入 编辑 界面 ， 如 
图 2-33 所 示 。 用 户 可 以 根据 需要 ， 修 改 相应 的 文本 与 图 片 ， 但 是 在 设计 内 容 时 ， 要 注意 不 要 
有 大 幅 的 文字 数据 ， 大 幅 的 文字 会 给 人 一 种 疲倦 的 心理 感受 ， 让 人 没 看 完 就 已 经 想 离开 界面 。 
所 以 在 设计 时 ， 如 果 有 大 幅 的 文字 数据 ， 可 以 尝试 用 图 表 来 表达 ， 形 象 化 的 图 表 不 仅 可 以 让 
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画面 更 美观 ， 还 可 以 引起 观看 者 的 兴趣 。 
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图 2-33 ”编辑 界面 
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但 是 创 客 贴 对 图 表 的 可 编辑 空间 不 大 ， 所 以 图 表 将 使 用 “百度 图 说 ”(http:/ 
tushuo.baidu.com) 工具 来 制作 。 进 入 “百度 图 说 "首页 , 单 击 “ 开 始 制作 图 表 ” 按 钮 , 按 提示 登录 ， 
再 单 击 “ 创 建 图 表 ” 按 钮 ， 将 会 弹出 相应 的 对 话 框 ， 在 对 话 框 中 根据 不 同性 质 的 数据 可 以 先 
择 合适 的 图 表 样式 ， 如 图 2-34 所 示 。 常 用 的 图 表 大 约 为 柱状 图 、 饼 图 和 折线 图 等 ， 柱 状 图 适 
合 表现 数量 的 对 比 ， 饼 图 适合 表现 数据 中 各 项 参数 的 比例 ， 折 线 图 适合 表现 相等 时 间 间 隔 下 
数据 的 趋势 走向 。 
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图 2-34 不同 的 图 表 样式 
此 处 选择 的 是 “标准 折线 图 ”图 表 样 式 。 进 入 图 表 编辑 因 面 ， 当 忌 标 光标 移 至 
图 表 中 时 ， 图 表 左 上 方 会 显示 相应 的 按钮 ， 单 击 “ 数 据 编 辑 ” 按 钮 ， 如 图 2-35 所 示 ， 和 界面 的 
左 侧 会 弹出 “数据 编辑 ”面板 ， 如 图 2-36 所 示 ， 通 过 双击 鼠标 左 键 对 表格 名 称 、 数 值 进行 修 
改 ， 可 以 直接 影响 折线 图 的 变化 。 
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图 2-35 单 击 “ 数 据 编辑 ”按钮 图 2-36 弹出 “数据 编辑 ”面板 


EZ ]04] 单 击 图 表 左 上 方 的 “数据 编辑 ”按钮 ， 在 弹出 的 面板 中 ， 可 以 对 图 表 的 尺寸 
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颜色 、 位 置 、 标 题 等 细 证 进行 相应 的 设置 ， 如 图 2-37 所 示 。 图 表 默 认 是 透明 的 背景 ， 如 采信 
明 长 图 的 背景 有 色彩 变化 ， 笔 者 建议 将 图 表 的 背景 设置 为 白色, 在 “参数 调整 ”面板 选择 “ 基 
础 ” |“ 通用 | “图 整体 背景 颜色 ”命令 ， 会 弹出 相应 的 对 话 框 ， 在 对 话 框 中 可 以 设置 需要 的 
色彩 ， 如 有 果 对 调整 后 的 色彩 不 满意 ， 也 可 以 单 击 对 话 框 右 下 角 的 鸭 按 钮 清除 颜色 ， 如 图 2-38 
所 示 。 


图 2-37 设置 相应 参数 图 2-38 清除 颜色 
本 05| 图 表 制作 完成 后 ， 单 击 图 表 右 上 方 的 回 图 标 进 行 保 存 ， 进 入 图 表 预 览 ， 在 图 表 
中 单 击 鼠 标 左 键 ， 即 可 下 载 图 表 ， 将 下 载 后 的 图 表 上 传 至 “ 创 客 贴 ” ， 再 将 图 表 添 加 至 信息 
长 图 页 面 中 即 可 。 设 计 完 成 后 ， 选 择 “ 文 件 ”| “保存 ” 命 令 ， 再 单 击 “ 下 载 ” 按 钮 ， 在 弹出 
的 “下 载 作品 ”对 话 框 中 ， 单 击 “ 确 认 下 载 ” 按 钮 ， 即 可 获得 设计 好 的 信息 长 图 。 
2.2.3 ”设计 九宫 格 匿 


九宫 格 图 片 是 由 九 个 方 格 形 的 图 片 拼接 组 成 的 ， 根 据 这 一 特性 ， 可 以 制作 出 一 些 有 创意 
的 图 片 。 如 图 2-39 所 示 ， 为 “新 东方 ” 的 九宫 格 宣传 海报 。 
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图 2-39 “新 东 万 ”的 九宫 格 宣 传 海报 
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的 rr 按钮 ， 如 图 2-40 Brzs, BE A UE 务 面 ， 设 秆 相应 画笔 形状 与 滤 镜 | 
击 “保存 到 本 地 ”按钮 ， 如 图 2-41 所 示 。 


jar george Wipro 
01] 在 “ 美 图 秀 秀 ”中 打开 一 张 需 要 制作 九宫 格 的 图 片 ， 单 击 “ 更 多 功能 ” 标 wA ⁄ 


nm E 
` ç e e: 


mi, UE 
“B PERU BH 


| EE L á 


言 加 和 字 章 GY Buna Dis 


aes | 
| iw 二 
3 


图 2-40 单 击 “ 九 格 切 图 ”按钮 图 2-41 单 击 “保存 到 本 地 ”按钮 


弹出 “保存 ”对 话 框 ， 选 中 “保存 9 张 切 图 ” 单 选 按钮 ， 单 击 “ 确 定 ” 按 钮 ， 
如 图 2-42 所 示 。 设 置 保存 位 置 后 即 可 保存 图 片 ， 再 次 打开 一 张 图 片 并 适当 裁剪 ， 单 击 左 侧 的 
“应 用 ”按钮 ， 应 用 裁剪 ， 再 单 击 下 方 的 “完成 裁剪 ”按钮 ， 如 图 2-43 所 示 。 
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图 2-42 单 击 “ 确 定 ”按钮 图 2-43 单 击 “ 完 成 裁剪 ”按钮 
03 弹出 “保存 与 分 享 ” 对 话 框 ， 单 击 “保存 ”按钮 ， 保 存 图 片 ， 如 图 2-44 所 示 。 


suwas pik, 按 顺 序 点 击 图 片 ， 用 裁剪 后 的 图 片 蔡 换 ”4.jpg 图 片 ， 编 辑 并 
发 表 ， 即 可 制作 出 九宫 格 效 果 ， 如 图 2-45 所 示 。 
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图 2-44 单 击 “保存 ”按钮 图 2-45 九宫 格 图 片 效果 
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2.2.4 ”设计 个 人 海报 


简 拼 是 一 款 记录 美好 、 抒 写 情 怀 的 拼图 APP， 其 模板 偏 简 约 文艺 风 ， 并 且 包 含 简约 、 便 
釜 、 封 面 、 拼 接 、 名 片 和 明信片 等 多 种 类 型 的 模板 。 同 时 ， 简 拼 还 拥有 强大 的 文字 编辑 功能 ， 
让 用 刀 可 以 最 大 限度 地 编辑 文字 。 下 面 笔者 将 详细 介绍 使 用 简 扩 APP 设计 海报 名 斤 的 方法 。 


进入 出 拼 APP, 辟 击 俘 面 下 方 的 加 按钮 ， 如 图 2-46 所 示 。 进 入 到 模 委 挑 选 务 面 ， 
选择 合适 的 模板 并 点 击 ， 如 图 2-47 所 示 。 
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图 2-46 点击 相应 按钮 图 2-47 点击 相 应 模板 
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02 进入 照片 选择 界面 选择 相应 图 片 ， 点 击 “ 下 一 步 ”按钮 ， 如 图 2-48 所 示 。 进 
了 用 户 可 以 根据 需要 替换 相应 图 片 。 如 有 条 选择 的 模板 含有 二 维 码 图 片 ， 也 可 
以 蔡 换 成 自己 的 微 信 二 维 码 ， 点 击 二 维 码 图 片 ， 如 图 2-49 所 示 。 


“MY BEAUTY STORE ， 
深 作家 | 构图 君 


图 2-48 点 击 “ 下 一 步 ”按钮 图 2-49 点击 二 维 码 图 片 


a 提示 用 户 需 要 先 保存 二 维 码 图 片 ， 并 且 有 相应 的 图 片 教程 ， 
保存 一 w. 返回 简 拼 APP 界面 。 点 击 界面 底部 的 [器 按钮， 如 图 2-50 所 示 。 按 提示 选择 
并 添加 一 维 码 图 片 ， 添 加 完毕 后 点 击 下 面 的 OK 按 钢 即 可 先 成 替换 自己 二 维 码 的 操作 ， 如 
图 2-51 所 示 。 


图 2-50 点击 相应 按钮 图 2-51 点 击 白色 万 框 
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点 击 相应 文字 ， 弹 出 输入 文本 框 ， 修 改 相 应 文本 内 容 ， 修 改 完 成 后 点 击 辆 | 按 
钮 确认 修改 ， 如 图 2-52 所 示 。 运 用 同样 的 方法 ， 修 改 其 他 文本 内 容 ， 修 改 完 成 后 点 击 右上 角 
的 图 图 标 ， 如 图 2-53 所 示 。 
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2 分 
图 2-52 确认 修改 图 2-53 点击 相 应 图 标 


弹出 三 个 按钮 ， 点 击 “ 保 存 到 本 地 ”按钮 ， 如 图 2-54 所 示 。 进 入 个 人 主页 ， 
系统 提示 海报 名 片 制作 完成 ， 如 图 2-55 所 示 ， 用 户 也 可 根据 需要 分 享 至 各 大 新 媒体 平台 。 


加 ”保存 到 草稿 箱 


巾 分 享 至 社区 


图 2-54 ”点击 “保存 到 本 地 ”按钮 2-55 ”提示 制作 完成 
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在 照片 选择 界面 选择 照片 时 ， 建 议 不 要 一 次 性 选择 多 张 图 片 ， 若 是 一 次 性 选择 了 多 
张 图 片 ， 再 点 击 “下 一 步 ”按钮 ， 如 图 2-56 所 示 ， 在 模板 编辑 界面 则 会 出 现 三 张 图 片 扒 
登 在 一 起 的 情况 ， 如 图 2-57 所 示 。 
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图 2-56 选择 了 多 张 图 片 图 2-5/ 图 片 堆 蕉 在 一 起 
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知识 导读 


据 数据 统计 ， 微 信和 朋友 圈 营 业 额 在 一 年 内 可 以 达到 1500 亿 元 以 上 ， 由 此 
可 见 ， 微 信 朋 友 圈 是 一 个 绝 佳 的 销售 场所 ， 将 自己 的 朋友 圈 设 计 得 有 个 性 一 些 ， 
可 以 让 更 多 的 人 记 住 你 ， 从 而 达到 提高 销售 额 的 目的 。 


本 章 重点 导航 
“日 月 视觉 ”朋友 圈 设计 
O “ 美 协 团队 ”朋友 圈 设 计 
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”“ 招 代理 | 招 加 盟 | 


k s. 无 经 验 考 把 手 教 你 蝶 必 收 


ee `... w EY (一 @ 美 协 成 队 90 后 创 姥 从 
国有 还 在 籁 周 不 到 钱 吗 ? ; W -- ` e 移动 互联 网 营销 金牌 讲师 
P. ooa meses = Pse x ep e 带领 6 万 人 成 就 起 
| ; q N". | ~ — r e 全 国 优秀 微 商 创业 师范 
加 入 我 人 ¿ < 昌 专业 合作 大 向 和 团队 


@ 加 六 我 ， 轻 松 塞 现 你 的 创业 圳 
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本 试 试 ， 怎 么 知道 自己 有 多 出 色 


SP 求生 欲 强 烈 的 你 ， 不 妨 试 下 这 组 
W Juga pim, 


妙手 回春 的 后 期 ! 将 普通 的 照片 
j 修成 精彩 大 片 ! 龙 飞 国庆 旅游 … 


sa N 求生 欲 强烈 的 你 ， 不 妨 试 下 这 组 
Ée; 小 姐姐 胶片 调 色 


本 《手机 摄影 构图 大 师 炼 成 术 }》， 
和 1 次 精通 200 多 种 最 精华 的 构 … 


站 媒 体 美 工 w mam ua mam > 
3.1 “日 月 视觉 ”朋友 圈 设 计 
在 制作 招 代 理 朋 友 圈 界面 时 ， 深蓝 色 背 景 加 紫色 的 光斑 点 绥 作 为 背景 图 像 ， 并 且 采 


用 层次 感 较 踢 的 主体 文字 ， ene ° 
本 实例 最 终 效果 如 图 3-1 所 示 。 
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. ty s 妙手 回春 的 后 期 ! 将 普通 的 照片 
出 修成 精彩 大 片 ! 龙 飞 国庆 旅游 … 
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图 3-1 实例 效果 
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3.1.1 制作 朋友 圈 相 册封 面 背景 ko 


下 面 详细 介绍 制作 朋友 圈 相 册封 面 育 景 效 朱 的 方法 。 

在 菜单 栏 中 ,选择 “文件 ” | 打开 命令， 打开 “朋友 圈 背 景 Jpg. 素材 图 像 ， 
aa. 

mH L F.A8rRBJAEJEOAiE L E., f B 34428 l H rHHJ GS 8 br B 225 mi|— A" EJE X 
框 ， 如 图 3-3 So 
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朋友 图 DP 
朋友 圈 相 册封 面 设计 民 


3-2 打开 素材 图 像 3-3 ”绘制 矩 形 选 框 


选择 选择 | 修改 | “羽化” 命令, 弹出 “羽化 选区 ”对 话 框 , 设置 “羽化 半径 
为 100 像素 ， 单 击 “ 确 定 按钮 ， 即 可 羽化 选区 ， 效 未 如 图 3-4 所 示 。 

选择 “窗口 | 调整 命令， 展开 “调整 ”面板 , 单 击 “ 曲 线 ” 按钮， 新 建 “ 则 
线 1 调整 图 层 ， 如 图 3-5 所 示 。 
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图 3-4 羽化 选区 图 3-5 ”新建 幸 整 图 技 


展开 “属性 ”面板 ， 在 曲线 上 单 而 鼠标 左 键 新 建 一 个 控制 点 ， 在 下 方 设置 “ 输 
入 ”为 172、“ 输 出 ”为 125， 如 图 3-6 所 示 。 
适当 降低 选区 内 图 像 的 亮度 ， 效 未 如 图 3-7 所 示 。 
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图 3-6 ”设置 各 参数 图 3-7 ”图像 效果 


3.1.2 ”制作 朋友 圈 相 册封 面 头 像 C2 


下 面 详细 介绍 制作 朋友 圈 相 册封 面 头像 效果 的 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 朋 友 圈 头像 jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 
图 像 拖 中 至 背景 图 像 编 辑 窗 口中 ， 适 当 调 整 图 像 的 位 置 ， 如 图 3-8 所 示 。 

2 02 选取 工具 箱 中 的 自 定形 状 工 具 ， 在 工具 属性 栏 中 单 击 “ 填 充 ” 右 侧 的 色 块 ， 在 
弹出 的 下 拉 列 表 框 中 选择 “渐变 ”选项 ,在 “ 预 设 ” 选 项 区 中 选择 “ 检 ， 黄 , 检 渐 变 ” 渐 变色 ， 
如 图 3-9 所 示 。 


不 透明度 | 8, 黄 , 模 新 变 _ 
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第 这 : 100 ~v|% 图 与 图 层 对 蛮 


图 3-8 调整 图 像 位 置 图 3-9 选择 “楼,， 黄 ， 楼 渐变 ”渐变 色 
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选择 渐变 条 下 的 第 三 个 色 标 ， 并 将 其 删除 ， 如 图 3-10 所 示 。 
继续 在 工具 属性 栏 中 设置 “ 描 边 ” 为 无 、“ 形 状 ” 为 “ 呈 冠 1 ,在 图 像 编 辑 
窗口 中 的 适当 位 置 绘 制 一 个 形状 ， 如 图 3-11 所 示 。 


_— 
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图 3-10 ”删除 色 标 图 3-11 绘制 形状 


在 图 层面 板 中 ,选择 “形状 1 图 层 , 单 击 鼠 标 右键 , 在 弹出 的 快捷 菜单 中 选择 “机 
格 化 图 层 ” 命 令 ， 如 图 3-12 所 示 ， 将 形状 栅 格 化 。 

按 CtrlHT 组 合 键 ， 调 出 变换 控制 框 ， 适 当 旋转 图 像 ， 并 按 Enter 键 确认 变换 ， 
运用 移动 工具 调整 图 像 的 位 置 ， 在 图 层面 板 中 调整 至 “朋友 圈 头 像 ”图 层 的 下 方 ， 如 图 3-13 
所 示 。 


3.1.3 ”制作 朋友 圈 相 册封 面 文案 


下 面 详细 介绍 制作 朋友 圈 相 册封 面 文案 效果 的 方法 。 

2 101 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “ 方 
正大 黑 简 体 ”、“ 字 体 大 小 ”为 12 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 00、“ 颜 色 ” 为 
白色 (RGB 参数 值 均 为 255。 在 图 像 编辑 窗 口中 输入 文字 ， 运 用 移动 工具 调整 文字 的 位 置 ， 
如 图 3-14 所 示 。 

52 102 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “ 方 
正 准 圆 简体 ”、“ 字 体 大 小 ”为 18 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 100、“ 颜 色 ” 为 
白色 (RGB 参数 值 均 为 255)。 在 图 像 编 辑 窗口 中 输入 文字 , 运用 移动 工具 调整 文字 的 位 置 ， 
如 图 3-15 所 示 。 
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fx 加 | 
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图 3-14 ”输入 并 调整 文字 
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图 3-15 “输入 并 调整 文字 
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朋友 圈 相 册封 面 设计 忆 


EZ; ]o3] 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 雅 黑 ”、“ 字 体 大 小 ”为 8 点 、 
“设置 所 选 字符 的 字 距 调整 ”为 100、“ 行 距 ” 为 14 点 、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 
255)， 在 图 像 编 辑 窗口 中 输入 文字 ， 运 用 移动 工具 调整 文字 的 位 置 ， 效 果 如 图 3-16 所 示 。 

EZ 04 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 雅 黑 ”、“ 字 体 大 小 ”为 12 点 、 
“设置 所 选 字符 的 字 距 调整 ”为 100、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 2355)， 在 图 像 编 辑 
窗口 中 输入 文字 ， 运 用 移动 工具 调整 文字 的 位 置 ， 效 果 如 图 3-17 所 示 。 
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图 3-16 输入 并 调整 文字 图 3-17 输入 并 调整 文字 


美 协 团队 ”朋友 图 设 计 


本 实例 设计 的 素材 是 “ 美 协 团队 ”的 企业 朋友 圈 相 册封 面 ， 主 要 采用 鉴 色 的 背景 ， 并 添 
加 华丽 的 装饰 素材 ， 可 以 很 好 地 突出 其 中 要 表达 的 信息 ， 效 末 如 图 3-18 所 示 。 
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3.2.1 设计 朋友 圈 封 面 背景 效果 

下 面 主要 运用 渐变 工具 和 光斑 素材 ， 制 作 蓝 色 的 封面 背景 效果 。 

选择 “文件 ”|“ 新 建 ” 命 令 ， 弹 出 “新 建文 档 ” 对 话 框 , 设置“ 名称” 为 “ 朋 
友 圈 相 册封 面 ”、“ 宽 度 ”为 600 像素 、“ 高 度 ” 为 600 像素 、“ 分 辨 率 ”为 300 像素 /英寸 
“颜色 模式 ”为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 设 置 完成 后 单 击 “ 创 建 ”按钮 ， 
如 图 3-19 所 示 ， 新 建 一 个 空白 图 像 。 

在 “图 层 ” 面 板 中 ， 新 建 “ 图 层 1” 图 层 ， 如 图 3-20 所 示 。 


(K 最 近 使 用 项 已 保存 B ” ”打印 图 稿 和 播 图 Wet 。 ” 称 动 设备 。 ”上 脐 片 和 视频 
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图 3-19 图 3-20 新 建 “ 图 层 1” E 


EZ:03] 选取 工具 箱 中 的 渐变 工具 ， 单 击 工具 属性 栏 中 的 “点 按 可 编辑 渐变 ”按钮 ， 
弹出 “渐变 编辑 器 ”对 话 框 ， 设 置 第 一 个 色 标的 颜色 为 深蓝 色 (RGB 参数 值 分 别 为 11、33、 
90)， 如 图 3-21 所 示 。 

设置 第 一 个 色 标 的 “位 置 ” 为 8%， 并 设置 另 一 个 色 标 的 颜色 为 浅 蓝 色 (RGB 
参数 值 分 别 为 18、150、231)， 如 图 3-22 所 示 。 

EZ=jfo5] 单 击 “ 确 定 ” 按 钮 ， 返 回 图 像 编 辑 窗口 ， 将 鼠标 指针 移动 至 图 像 编辑 窗口 的 左 
下 角 位 置 , 单 击 鼠标 左 键 并 向 右上 角 拖 电 ， 释放 鼠标 左 键 ， 填充 径 向 渐变 颜色 ， 效 果 如 图 3-23 
所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 烟 花 jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
虑 至 背景 图 像 编 辑 窗口 中 的 适当 位 置 ， 如 图 3-24 所 示 。 

在 “图 层 ” 面板 中 , 设置 “图 层 2” 图 层 的 “混合 模式 ”为 “ 滤 色 ”, 效果 如 图 3-25 
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3-21 设置 第 一 个 色 标 的 颜色 
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图 3-23 填充 渐变 颜色 图 3-24 ”添加 烟花 素材 


选取 工具 箱 中 的 矩形 选 框 工具 ,在 图 像 编辑 窗口 中 绘制 一 个 矩形 选 框 ,如 图 3-26 
所 示 。 

选择 选择 | 修改 | 羽化 命令 , 弹出 “羽化 选区 对 话 框 , 设置 “羽化 半径 - 
为 50 像素 ， 单 击 “ 确 定 按钮 ， 即 可 羽化 选区 ， 效 未 如 图 3-27 所 示 。 

新 建 “ 曲 线 1 ”调整 图 层 ， 展开 “属性 ”面板 ， 在 曲线 上 单 击 鼠标 左 键 新 建 一 
个 控制 点 ， 在 下 方 设置 “输入 ”为 200、“ 输 出 ”为 72， 适 当 降 低 选 区 内 图 像 的 亮度 ， 效 末 
如 图 3-28 所 示 。 
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图 3-25 ”混合 图 像 效 果 图 3-26 ”绘制 窍 形 选 杠 


图 3-2/ 羽化 选区 图 3-28 降低 选区 内 图 像 的 亮度 


3.2.2 ”设计 朋友 圈 封 面 主体 效果 时 


ee 制作 出 朋友 圈 封 面 主体 人 物 效 末 。 

01| 按 Ctrl+O 组 合 键 ， 打 开 “ 人 物 jpg” 素 材 图 像 ， 如 图 3-29 所 示 。 

02| 选取 工具 箱 中 的 磁性 套 索 工具 , 沿 着 人 物 边 缘 拖 电 将 人 物 选 中 , 如 图 3-30 所 示 。 
对 03| 按 Ctrl+J 组 合 键 ， 复 制 选区 内 的 图 像 ， 得 到 “图 层 1” 图 层 ， 如 图 3-31 所 示 。 
隐藏 “背景 ”图 层 ， 即 可 抠 取 人 物 部 分 的 图 像 ， 效 果 如 图 3-32 所 示 。 
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图 3-29 打开 素材 图 像 3-30 选中 人 物 


到 所 
pm -四 ETDOB 
正常 v| 不 通明 度 : |100% | 


图 3-31 拷贝 选区 内 的 图 像 图 3-32 ”隐藏 青 景 图 层 


现在 微 信 朋友 图 的 主要 消费 者 是 年 轻 人 ， 大 多 数 年 轻 人 将 个 性 放 在 首位 ， 讲 完 潮流 
和 时 尚 ， 因 此 朋友 图 要 做 好 营销 ， 首 当 其 冲 的 就 是 要 做 好 个 性 营销 ， 满 足 他 们 “要 不 我 
第 一 ， 要 不 我 唯一 ”的 独特 个 性 ， 实 现 与 他 们 思维 的 同 频 ， 获 得 共鸣 和 共振 效果 ， 才 能 
更 好 地 拉 近 与 他 们 的 距离 ， 实 现 营 销 。 

现在 都 讲 视 觉 营销 ， 也 讲 位 置 的 重要 性 ， 而 微 信 朋友 图 首先 进入 大 家 视野 的 就 是 微 
信 的 头像 。 可 以 说 , 这 小 小 的 头像 图 片 ， 就 是 徽 信 最 引 人 注 目的 广告 位 ,我 们 一 定 要 用 好 ， 
千 万 不 要 浪费 了 | 
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运用 移动 工具 ， 将 选区 内 的 图 像 拖 暇 至 背景 图 像 编辑 窗口 中 ， 适 当 调整 其 大 小 
和 位 置 ， 如 图 3-33 所 示 。 


2: 3 06| 选取 工具 箱 中 的 磁性 套 索 工具 ,在 人 物 图 像 上 创建 一 个 选区 ， 如 图 3-34 所 示 。 


3-33 ”合成 人 物 图 像 3-34 ”创建 自由 选区 


2 更 河 07| Ez Ctrl+ShifttI 组 合 键 反 向 选择 选区 ， 如 图 3-35 所 示 。 
2 3 08| 按 Delete 键 删除 选区 内 的 图 像 并 按 CtrltD 组 合 键 取消 选区 ,效果 如 图 3-36 所 示 。 
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图 3-35 上 反 向 选择 图 3-36 ”调整 图 像 
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文字 是 多 数 设 计 作 品 尤其 是 商业 作品 中 不 可 或 缺 的 重要 元 素 ， 有 时 黄 至 在 作品 中 起 
着 主导 作用 ，Photoshop 除了 提供 丰富 的 文字 属性 设计 及 版 式 编排 功能 外 ， 还 允许 对 文字 
的 形状 进行 编辑 ， 以 便 制 作出 更 多 、 更 丰富 的 文字 效果 。 

为 作品 添加 文字 对 于 任何 一 种 软件 者 是 必 备 的 ， 对 于 Photoshop 也 不 例外 ， 用 户 可 以 
在 Photoshop 中 为 作品 添加 水 平 或 者 垂直 排列 的 各 种 文字 ， 还 能 够 通过 特别 的 工具 创建 文 
字 的 选择 区 域 ， 更 好 地 进行 创意 设计 。 
打开 “ 麦 穗 png” 素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 蝶 至 背景 图 像 编 辑 窗 
口中 的 适当 位 置 。 适 当地 调整 图 层 顺 序 和 大 小 ， 效 果 如 图 3-37 所 示 。 
选择 横 排 文字 工具 ， 设 置 字体 为 “ 华 康 海报 体 W...”、 字 体 大 小 为 12 点 、 输 
入 相应 的 文字 ,在 “图 层面 板 ” 中 ， 双 击 文 字 图 层 , 添加 “斜面 与 浮雕 ”图 层 样式 , 设置 “ 样 
式 ” 为 “外 斜面 ”、“ 方 法 ”为 “ 平 消 ”、“ 深 度 ” 为 927%、“ 大 小 ”为 4 像素 、“ 阴 影 模式 ” 
为 “正片 登 底 ”、 阴 影 模 式 下面 的 “不 透明 度 ” 为 48%， 效 果 如 图 3-38 所 示 。 
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图 3-3⁄ 8 |Ee=lMFY 图 3-38 ”添加 文字 效果 


3.2.3 ”设计 朋友 圈 封 面 文字 效果 
下 面 主 要 运用 算 形 选 框 工具 和 渐变 工具 制作 文字 的 底 纹 ， 让 文本 内 容 更 加 突出 ， 实 现 更 


好 的 宣传 效果 。 
选取 工具 箱 中 的 矩形 选 框 工具 ,在 图 像 编 辑 窗口 中 绘制 一 个 矩形 选 框 ,如 图 3-39 
所 示 。 


在 “图 层 ” 面 板 中 ， 新 建 “ 图 层 5” 图 层 ， 如 图 3-40 所 示 。 
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图 3-39 ”绘制 矩形 选 框 图 3-40 ”新 建 图 层 


9 专家 指点 


在 自己 的 朋友 圈 中 , 点 击 相册 封面 的 背景 图 片 , 会 弹出 设置 背景 页 面 , 可 以 自行 更 换 。 
朋友 团 的 相册 封面 是 一 个 很 重要 的 广告 入 口 ， 专 业 的 、 有 经 验 的 企业 邦 会 将 广告 作为 朋 
友 圈 的 封面 ， 其 他 需要 打 广 告 的 商家 也 可 以 用 这 种 方法 。 


选取 工具 箱 中 的 渐变 工具 , 设置 新 变 类 型 为 径 回 渐变 , 单 击 工具 属性 栏 中 的 “点 
按 可 编辑 渐变 ”按钮 ， 弹 出 “渐变 编辑 颖 ”对 话 框 ,设置 渐 变色 为 日 色 到 通 明 ， 如 图 3-41 所 
示 ， 单 击 “ 确 定 按钮。 

22 3 04| 运用 渐变 工具 在 和 矩形 选区 的 中 间 至 周围 区 域 拖 卡 ， 填 充 渐 变色 ， 取 消 选区 ， 如 
图 3-42 所 示 。 


1 名 称 (M 自 定 


渐变 类 型 ;: 实 ~ 
平滑 度 (M): 100 ”| % 


图 3-41 设置 渐变 色 图 3-42 填充 渐变 色 
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< <<< 朋友 图 相册 封面 设计 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
大 黑 简 体 ”、“ 字 体 大 小 ”为 5 点 、“ 所 选 字 符 的 字 距 调整 ”为 200、“ 颜 色 ” 为 深蓝 色 (RGB 
参数 值 分 别 为 5、15、61)。 在 图 像 编辑 窗口 中 输入 文字 ， 如 图 3-43 所 示 。 

打开 “文字 psd” 素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 由 至 背景 图 像 编辑 窗 
口中 的 适当 位 置 ， 效 果 如 图 3-44 所 示 。 


图 3-43 输入 文字 图 3-44 ”添加 文字 素材 
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伴随 着 微 信 的 火爆 发 展 , 微 信 公众 平台 也 应 运 而 生 。 越 来 越 多 的 商家 . 企业 、 
个 人 都 申请 开通 微 信 公众 平台 ， 用 于 营销 或 者 其 他 用 途 。 所 以 微 信 公众 号 的 界 
面 设 计 也 变 得 重要 起 来 ， 寺 观 的 界面 更 吸引 人 ， 更 容易 获得 天 注 。 


公众 号 求 关注 设计 
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X ”手机 摄影 构图 大 全 
通关 密码 : 购买 电子 书 


转账 后 ， 请 留 下 六 所 邮箱 ，1-12 小 时 内 点 到 邮 
箱 ， 下 载 即 可 观看 。 


1000 多 种 构图 按 法 和 实 担 作品， 持续 揭秘 、 训 
析 中 ， 请 关注 微 信 公众 号 : 手机 摄影 构图 大 全 


(goutudaquan) ， 骏 迎 太 农 有 好 的 构图 想法 或 疑 
问 ， 留言 沟通 。 
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41 公众 号 封面 广告 设计 


微 信 公众 三 封面 广告 是 微 信 文章 正文 非常 重 要 的 一 部 分 ， 一 个 精美 的 封面 ， 带 给 平台 的 
阅读 量 古 不 可 估量 的 。 图 片 能 够 给 文字 插 上 飞翔 的 妈 膀 ， 让 文字 所 要 传达 的 情感 更 加 深入 人 
心 ， 运 用 得 当 的 图 片 能 够 成 为 微 信 公 众 号 打动 读者 的 强力 武 茵 。 本 实例 主要 介绍 一 个 图 书 宣 
传 的 短信 公众 号 封 徊 广告 乔 面 设计 ， 效 霖 如 图 4-1 所 示 。 
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* 一 本 深度 手机 摄影 笔记 ,让 你 拍 出 
与 众 不 同 的 大 片 
。 一 学 就 会 的 摄影 高 手 技巧 ， 留 住 镜 
头 下 最 美的 时 光 


| ”构图 大 师 直播 教程 摄影 图 书 


图 4-1 微 信 公 众 号 封面 广告 界面 设计 


扫 一 扫 观 看 在 线 视频 : 
公众 号 封面 广告 设计 


4.1.1 设计 公众 号 封面 广告 背景 效果 L. 
下 面 主 要 运用 “ 描 边 ”命令 制作 黑色 的 背景 边框 效果 ， 让 公众 号 封面 广告 的 层次 感 更 强 。 
选择 “文件 ” |“ 新 建 ”命令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设 置 “ 名 称 ” 为 “ 公 

众 写 封面 广告 设计 ”、“ 宽 度 ” 为 900 像素 、“ 高 度 ” 为 500 像素 、“ 分 辨 率 ” 为 300 像素 

/英寸 “颜色 模式 ”为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 设 置 完成 后 单 击 “ 创 建 ” 

按钮 ， 如 图 4-2 所 示 ， 新 建 一 个 空白 画布 。 

在 “图 层 ”面板 中 ， 新 建 “图 层 1” 图 层 ， 并 填充 为 和 白色， 如 图 4-3 所 示 。 
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对 于 封面 图 片 的 尺寸 大 小 ， 平 台 给 出 的 建议 是 : 如 果 是 小 图 片 ， 建 议 大 小 为 200 像 
素 x200 像素 .笔者 给 出 的 建议 是 : 900 像素 x500 像 素 , 有 时 候 , 图 片 尺 寸 过 大 或 者 过 小 ， 
很 容易 造成 图 片 被 压缩 变形 ， 那 样 制作 出 来 的 效果 就 会 大 打折 扣 。 


选择 “编辑 | 描 边 ” 命令， 弹出 “ 描 边 ”对 话 框 ， 设 置 “宽度 ”为 15 像素 、 
颜色 ”为 震 色 、“ 位 置 ” 为“ 内部”， 如 图 4-4 所 示 。 


tpi B 


公众 号 封面 广告 设计 


图 4-2 “新 建文 档 ” 对 话 框 图 4-3 新 建 “ 图 层 1” 图 层 


单 击 “确定 ”按钮 ， 即 可 添加 描 边 效果 ， 如 图 4-5 所 示 。 


1 O 内 部 (I) ”中居 中 (CO) “() Bm3KU) 


模式 : 正常 
不 透明 度 (0): 100 
LDL) 保留 透明 区 域 (p) 


图 4-4 ”设置 “ 描 边 ”选项 图 4-5 “添加 描 边 效果 
4.1.2 设计 公众 号 封面 广告 主体 效果 _ c... 


下 面 主 要 运用 变换 工具 和 图 层 蒙 版 工具 等 ， 制 作 书 籍 封面 主体 的 立体 效 末 和 倒影 效 打 ， 


1 u. 


wr rsrr 


SHIRIK2ET Vm — > 


让 图 像 看 上 去 更 加 真实 。 
按 Ctrl+O 组 合 键 ， 打开“ 书籍 psd” 素 材 图 像 ， 如 图 4-6 所 示 。 
选取 工具 箱 中 的 矩形 选 框 工具 , 在 书籍 封面 的 正面 创建 一 个 矩形 选区 , 如 图 4-7 


高 手 新 玩法 j| 
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图 4-6 打开 素材 图 像 图 4-7 创建 矩形 选区 


22: 3 03| 按 Ctrl+T 组 合 键 ， 调 出 变换 控制 框 ， 在 其 中 单 击 鼠标 右键 ， 在 弹出 的 快捷 菜 
单 中 选择 “扭曲 ”选项 ， 如 图 4-8 所 示 。 

按 住 Shift 键 的 同时 ， 依 次 辣 下 和 癌 上 拖 和 请 相应 的 控制 柄 ， 扭 曲 图 像 ， 按 Enter 
键 ， 确 认 变换 操作 ， 如 图 4-9 所 示 。 


图 4-8 选择 “扭曲 ”选项 图 4-9 扭曲 图 像 


按 CtrltJ 组 合 键 , 复制 选区 内 的 图 像 , 得 到 “图 层 1” 图 层 ; 选择 编辑 | “ 变 
F” | “垂直 翻转 ”命令 ， 垂 直 翻 转 图 像 ， 并 将 其 移 至 合适 的 位 置 ， 效 末 如 图 4-10 所 示 。 
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选择 “编辑 ”| “变换 ”| “和 斜 切 ” 命 令 ， 调 出 变换 控制 框 ， 向 上 拖 忠 右 侧 的 
控制 柄 至 合适 的 位 置 ， 按 Enter 键 ， 确 认 变 换 操 作 ， 效 灯 如 图 4-11 所 示 。 


图 4-10 ”垂直 翻转 图 像 图 4-11 和 斜 切 图 像 


专家 指点 )) 


选区 在 图 像 编辑 过 程 中 占有 重要 的 位 置 ， 它 限制 着 图 像 编辑 的 范围 和 区 域 ， 灵 活 而 
巧妙 地 应 用 选区 ， 能 得 到 许多 意 想不到 的 效果 。 
在 “图 层 ” 面 板 中 ， 设 置 “ 图 层 1” 图 层 的 “不 透明 度 ” 为 40%， 单 击 “ 图 层 ” 
面板 底部 的 “ 语 加 图 层 莹 版” 按钮， 添加 图 层 蒙 版 。 使 用 剖 变 工具 ， 在 图 像 编辑 窗口 中 ， 从 
下 同上 拖 忠 ， 填 充 黑 色 到 白色 的 线性 渐变 ， 隐 藏 部 分 图 像 ， 如 图 4-12 所 示 。 
用 与 上 同样 的 方法 ， 制 作 书 籍 封 面 侧 面 的 立体 效果 ， 如 图 4-13 所 示 。 


图 4-12 隐藏 部 分 图 像 图 4-13 ”制作 侧面 立体 效果 
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4.1.3 设计 公众 号 封面 广告 整体 效果 JU 


下 面 主要 运用 图 层 样式 和 文字 工具 ， 制 作 公众 号 封面 广告 的 整体 效果 。 

在 “图 层 ” 面 板 中 ， 选 择 除 “ 背 景 ”图 层 外 的 其 他 所 有 图 层 ， 单 击 鼠 标 右键 ， 
在 弹出 的 快捷 菜单 中 选择 “合并 图 层 ”命令 ， 如 图 4-14 所 示 。 
将 合并 后 的 图 像 拖 中 至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 其 大 小 和 位 置 ， 效 果 
如 图 4-15 所 示 。 


图 4-14 选择 “合并 图 层 ” 命 令 图 4-15 拖 入 书籍 封面 立体 素材 


双击 “图 层 2” 图 层 , 弹出 “图 层 样式 ”对 话 框 , 选中 “投影 ” 复 选 框 , 设置 “ 距 
离 ”为 5 像素、“ 大 小 ”为 15 像素 ， 如 图 4-16 所 示 。 

单 击 “ 确 定 ”按钮 ， 即 可 添加 “投影 ”图 层 样式 ， 效 果 如 图 4-17 所 示 。 

选取 工具 箱 中 的 横 排 文 字 工 具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
大 黑 简 体 ”、“ 字 体 大 小 ”自由 调整 、 “行距 ”为 18 点 、“ 颜 色 ” 为 绿色 RGB 参数 值 分 别 
为 147、145、9) 和 黑色 (RGB 参数 值 均 为 0)， 如 图 4-18 所 示 。 


新 如 样式 lw).，) | 
后 览 [V1 | 


图 4-16 设置 “投影 ”选项 图 4-17 添加 “投影 ”图 层 样 式 


“56 


SE 55 


公众 号 


推 文 广告 与 求 关注 设计 攻 


2 806 运用 横 排 文字 工具 创建 一 个 文本 框 ， 在 其 中 输入 相应 的 文字 ， 适 当 调整 文本 框 
的 大 小 和 人 位置， 如 图 4-19 所 示 。 


图 4-18 设置 字符 属性 图 4-19 输入 标题 文字 


22 807 运用 横 排 文字 工具 创建 一 个 文本 框 ， 输 入 相应 的 文字 ， 在 “字符 ”面板 中 设置 
“字体 系列 ”为 “微软 雅 时 ”、“ 字 体 大 小 ”为 6 点 、“ 行 距 ” 为 10 点 ， 分 别 为 字符 和 文字 
设置 不 同 的 “颜色 ”参数 ， 效 末 如 图 4-20 所 示 。 

打开 “按钮 .psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 蝶 至 背景 图 像 编 辑 窗 
口中 的 适当 位 置 ， 效 果 如 图 4-21 所 示 。 


《大 片 这 么 拍 ! a 《大 片 这 么 拍 ， 
3 手机 摄影 高 手 新 玩法 》 F = š 手机 摄影 高 手 新 玩法 / 


和 一 术 深度 手机 摄 破 苞 记 ,让 你 拍 出 s s 一 本 深度 手机 摄影 笔记 ， 让 你 拍 出 

I | a 1 “与 众 不 同 的 大 片 ! L 
nang Ga 
头 王 最 美的 时 光 ! 


图 4-20 ”输入 宣传 文字 图 4-21 添加 按钮 素材 


4.2 ”公众 号 内 容 图 片 设计 


短 信 公 众 号 是 开发 者 或 商家 在 微 信 公众 平台 上 申请 的 应 用 账号 ， 通 过 公众 号 ， 商 家 可 在 
微 信 平台 上 实现 和 特定 群体 的 文字 、 图 片 、 语 音 、 视 频 的 全 方位 沟通 、 互 动 。 一 个 成 功 的 微 
信和 公众 号 , 可 以 更 好 地 推广 自己 的 产品 ,服务 或 理念 等 内 容 。 接 下 来 我 们 制作 公众 号 内 容 设计 ， 


n ⁄——— 


w 
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效果 如 图 4-22 所 示 。 
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图 4-22 ”实例 效果 


扫 一 扫 观 看 在 线 视频 . 
公众 号 内 容 图 片 设 计 


4.2.1 制作 内 容 图 片 主体 效果 JU 


选择 “文件 | “新建 ”命令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设 置 “名 称 ”为 “ 湘 
江 夜 景 ”、“ 宽 度 ” 为 1080 像素 、“ 高 度 ” 为 1920 像素 、“ 分 辨 率 ” 为 72 像素 /英寸 、 颜 
色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “日 色 ”, 设置 完成 后 单 击 “ 创 建 ” 按 钮 ， 如 图 4-23 
所 示 ， 新 建 一 个 空白 画布 。 

按 Cal+O 组 合 键 ， 打 开 “ 照 片 1Ljpg” 素 材 图 像 ， 如 图 4-24 所 示 。 

22: 3 03| 运用 移动 工具 将 其 拖 电 至 背景 图 像 编 辑 窗口 中 ， 如 图 4-25 所 示 。 

按 Ctrl+T 组 合 键 ， 调 出 变换 控制 框 ， 适 当地 调整 图 像 的 大 小 和 位 置 ， 效 果 如 
图 4-26 所 示 。 

按 Ctrl+O 组 合 键 ， 打开“ 照片 2jpg”， 运 用 移动 工具 将 其 拖 卡 至 背景 图 像 纺 
辑 窗 口中 ， 适 当地 调整 图 像 的 大 小 和 位 置 ， 如 图 4-27 所 示 。 

按 Ctrl+O 组 合 键 ， 打开 “照片 3jpg”， 运 用 移动 工具 将 其 拖 虹 至 背景 图 像 编 
辑 窗 口中 ， 适 当地 调整 图 像 的 大 小 和 位 置 ， 如 图 4-28 所 示 。 
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4-24 ”打开 图 片 


图 4-25 打开 素材 图 像 4-26 ”调整 图 片 


图 4-2/ 调整 图 片 图 4-268 调整 图 片 
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公众 号 文章 编辑 可 以 根据 公众 号 定位 的 读者 ， 按 其 阅读 时 间 和 阅读 习惯 而 对 图 片 的 
大 小 做 调整 。 之 所 以 说 要 选择 合适 的 图 片 大 小 ， 就 是 从 给 读者 阅读 体验 出 发 的 ， 避 免 让 
过 大 的 图 片 耗费 读者 大 量 的 流量 ， 同 时 还 要 耗费 图 片 加 载 的 时 间 。 


4.2.2 制作 内 容 图 片 文字 效果 OD 


下 面 详细 介绍 制作 内 容 图 片 文字 效果 的 方法 。 
在 工具 箱 中 选取 横 排 文 字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 


粗 宋 简体 ”、“ 字 体 大 小 ”为 55 点、“ 设 置 所 选 字符 的 字 距 调整 ”为 25 点 、 颜 色 为 黑色 ， 
如 图 4-29 所 示 。 
2 302 输入 文字 “《 湘 江 夜 景 》”， 拖 蝶 至 合适 的 位 置 ， 如 图 4-30 所 示 。 
= FE J p 3 == 
| [方正 粗 守 简体 [~] - | ~ 
T 55 点 v| A 108 v 
VA o VAIEE 


图 4-29 设置 字符 面板 图 4-30 Ren 2 Simi ju P 


再 次 运用 横 排 文字 工具 输入 相应 的 文字 ， 在 “字符 ”面板 中 设置 “字体 系列 ” 
为 “微软 雅 黑体 ”、“ 字 体 大 小 ”为 36 点 、“ 行 中 ”为 自动 、“ 所 选 字符 的 字 距 调整 ”为 -75 
点 ， 然 后 拖 电 至 合适 的 位 置 ， 如 图 4-31 所 示 。 

按 CultO 组 合 键 , 打开 “文字 2.psd” 素材 图 像 , 适当 地 调整 图 像 的 大 小 和 位 置 ， 
如 图 4-32 所 示 。 


专家 指点 )) 


很 多 读者 在 阅读 文章 的 时 候 布 望 能 有 一 个 轻松 、 愉 快 的 阅读 体验 ， 不 愿 在 压抑 的 环 
境 下 阅读 ， 所 以 在 选择 图 片 时 要 注意 选择 那些 色彩 明亮 的 图 片 ， 这 种 类 型 的 图 片 能 给 读 
者 带 来 轻松 的 阅读 体验 。 
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图 4-31 输入 文字 图 4-32 添加 素材 图 像 


按 CtrltO 组 合 键 ,打开 “公众 号 二 维 码 .psd ”素材 图 像 ， 适 当地 调整 图 像 的 
大 小 和 位 置 ， 如 图 4-33 所 示 。 

在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 细 跨 一 简体 、 “字体 大 小 ”为 
30 点 、 “所 选 字符 的 字 距 调整 ”为 -50 点 ， 运 用 横 排 文字 工具 输入 相应 文字 ， 适 当地 调整 文 
字 的 位 置 ， 如 图 4-34 所 示 。 
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图 4-33 ”添加 素材 图 像 4-34 输入 文字 
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在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 黄 草 简体 ”、“ 字 体 大 小 ”为 48 点 、 
“行距 ”为 60 点 ，“ 所 选 字符 的 字 距 调整 ”为 50 点 ， 如 图 4-35 所 示 。 

选择 工具 箱 中 的 “ 横 排 文字 工具 ”输入 相应 文字 ， 适 当地 调整 文字 的 位 置 ， 如 
图 4-30 所 示 。 


[80] : 
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图 4-35 设置 字 竺 面板 图 4-36 输入 文字 


SE sa 


像素 是 组 成 图 像 的 最 小 元 素 ， 由 于 它们 都 是 正方 形 的 ， 所 以 在 创建 圆 形 、 多 边 形 
等 不 规则 选区 时 便 容 易 产 生 锯 此 ， 此 时 可 以 匀 选 工具 属性 栏 中 的 “消除 锯 此 ” 复 选 杠 
Ë ishu. ， 匀 选 该 选项 后 ，Photoshop 会 在 选区 边缘 1 个 像素 宽 的 范围 内 添加 与 周围 图 像 
相近 的 颜色 ， 使 选区 看 上 去 更 光滑 一 些 。 


4.3 公众 号 求 关 注 设 计 


在 制作 公众 号 求 关注 图 片 时 ， 运 用 和 盾 形 工具 绘制 出 线 框 效果 ， 加 上 适当 的 装饰 性 图 形 ， 
再 放 入 二 维 码 ， 配 上 一 些 说明 性 的 文字 ， 可 以 准确 地 将 信息 传达 给 读者 ， 为 自 媒体 名 人 和 微 
信 公 众 马 获得 更 好 的 引 尝 效 未 ， 如 图 4-37 所 示 。 
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车 王 后 ， 访 留 下 QQ 邮箱 ，1~12 小 时 内 发 到 邮 
箱 ， 下 载 即 可 观看 。 
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图 4-37 ”实例 效果 


扫 一 扫 观 看 在 线 视频 , 
公众 与 求 天 注 设 计 


4.3.1 制作 和 矩 形 框 背景 效果 


下 面 详细 介绍 制作 公众 号 求 关注 界面 中 的 矩形 框 背景 效果 的 方法 。 

01 选择 “文件 ”|“ 新 建 ”命令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设置“ 名称” 为 “ 公 
i “宽度 ”为 926 像 素 、“ 高 度 为 976 像 素 、 分 辨 率 为 300 像 素 /英寸 、 颜 
色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内容 ” 为 “白色 ”， 如 图 4-38 所 示 ， 设 置 完成 后 单 击 “ 创 
i phn 白 图 像 。 

02| 选取 工具 箱 中 的 矩形 工具 ， 在 图 像 编辑 窗口 中 绘制 一 个 矩形 框 ， 设 置 “填充 ” 
or 参数 值 均 为 2353)、 描 边 ”为 灰色 (RGB 参数 值 均 为 130)、 描 边 宽度 ”为 1 像素 ， 
效果 如 图 4-39 所 示 。 
复制 “矩形 1” 图 层 ， 得 到 “ 算 形 1 拷贝 ”图 层 ， 如 图 4-40 所 示 。 
复制 第 形 框 ， 适 当地 调整 其 大 小 和 位 置 ， 效 果 如 图 4-41 所 示 。 
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图 4-39 绘制 矩形 框 
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图 4-40 复制 图 层 图 4-41 复制 托 形 杠 


4.3.2 ”制作 公众 号 求 关注 主体 效果 ° 


下 面 详细 介绍 制作 公众 号 求 关 注 主体 效果 的 方法 。 

选择 “文件 | 打开” 命令， 打开 “公众 号 二 维 码 .psd ”素材 图 像 ， 运 用 移动 
工具 将 素材 图 像 拖 中 至 背景 图 像 编辑 窗口 中 的 适当 位 置 并 调整 其 大 小 ， 如 图 4-42 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 图 像 编辑 窗 口中 输入 文字 ， 在 “字符 ”面板 
中 设置 “字体 系列 ”为 “方正 兰 享 超 细 ”、“ 字 体 大 小 ”为 8 点 、“ 颜 色 ” 为 黑色 (RGB 参 
数值 均 为 0)、“ 字 体 行距 ”为 10 点 ， 输 入 相应 的 文字 ， 效 果 如 图 4-43 所 示 。 
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图 4-42 #Hen2EZ 图 4-43 输入 文字 
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文字 是 多 数 设 计 作 品 尤其 是 广告 作品 中 不 可 或 缺 的 重要 元 素 ， 有 时 黄 至 在 作品 中 起 
着 主导 作用 ，Photoshop 除了 提供 丰富 的 文字 属性 设计 及 版 式 编排 功能 外 ， 还 允许 对 文字 
的 形状 进行 编辑 ， 以 便 制 作出 更 多 、 更 丰富 的 文字 效果 。 


用 与 以 上 同样 的 方法 ， 输 入 其 他 文字 的 效果 ， 如 图 4-44 所 示 。 

选取 工具 箱 中 的 矩形 工具 ， 设置 “填充 ”为 灰色 (RGB 参数 值 为 
167 : 163 : 163)、“ 描 边 ” 为 无 ， 在 图 像 编辑 窗口 中 绘制 一 个 大 小 合适 的 矩形 图 像 ， 效 果 
如 图 4-45 所 示 。 
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图 4-44 输入 文字 图 4-45 ”绘制 宅 形 框 
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EZ. 305 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
细 直 一 简体 ”、“ 字 体 大 小 ”为 8 点 、 “颜色 ”为 起 色 (RGB 参数 值 均 为 0)， 在 图 像 编辑 窗 
口中 输入 相应 的 文字 ， 效 采 如 图 4-46 所 示 。 


图 4-46 输入 文字 


按 Ctrl+O 组 合 键 ， 打 开 “ 稍 头 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
中 至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 和 大 小 ， 效 果 如 图 4-47 所 示 。 


图 4-47 添加 素材 图 像 
为 作品 添加 文字 对 于 任何 一 种 软件 都 是 必 备 的 ， 对 于 Photoshop 来 说 也 不 例外 ， 用 户 可 
以 在 Photoshop 中 为 作品 添加 水 平 、 垂 直 排列 的 各 种 文字 ， 还 能 够 通过 特别 的 工具 创建 文字 


4.3.3 制作 目 媒 体 求 关注 主体 效果 | 


下 面 详细 介绍 制作 自 媒体 名 人 求 关注 界面 主体 效果 的 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 人 物 照片 jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 
拖 电 至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 和 大 小 ， 效 果 如 图 4-48 所 示 。 

按 Ctrl+O 组 合 键 ， 打开 “名 人 二 维 码 .png” 素 材 图 像 ， 运 用 移动 工具 将 素材 
图 像 拖 电 至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 4-49 所 示 。 

选取 工具 箱 中 的 矩形 工具 ， 设 置 “填充 ”为 灰色 (RGB 参数 值 均 为 207)、“ 描 
边 ” 为 无 ， 在 图 像 编 辑 窗口 中 绘制 一 个 大 小 合适 的 矩形 图 像 ， 如 图 4-50 所 示 。 
复制 多 个 矩形 图 像 ， 适 当地 调整 其 位 置 ， 效 果 如 图 4-51 所 示 。 
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图 4-48 拖 鼻 图 片 图 4-49 调整 图 像 位 置 


图 4-50 ”绘制 矩形 框 图 4-51 复制 矩形 图 层 


专家 指点 


在 运用 算 形 工具 绘制 图 形 时 ， 按 住 Shift 键 的 同时 ， 在 窗口 中 单 击 息 标 左 键 并 抑 复 ， 
可 以 绘制 一 个 正方 形 ; 如 果 按 住 Alt 键 的 同时 ， 在 窗口 中 单 击 筷 标 左 键 并 拖 押 ， 可 以 绘制 
以 起 点 为 中 心 的 矩形 ; 如 果 按 住 Shiftt+Alt 组 合 键 的 同时 ， 在 窗口 中 单 击 息 标 左 键 并 抑 复 ， 
可 以 绘制 以 起 点 为 中 心 的 正方 形 。 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
细 黑 一 简体 ”、“ 字 体 大 小 ”为 5.5 点 、“ 行 距 ” 为 12 点 、“ 颜 色 ” 为 黑色 (RGB 参数 值 均 为 0)， 
在 图 像 编辑 窗口 中 输入 相应 文字 ， 效 果 如 图 4-52 所 示 。 

按 Ctl+O 组 合 键 ， 打 开 “ 求 关注 按钮 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 
像 拖 中 至 背景 图 像 编 辑 窗 口中 的 合适 位 置 ， 效 果 如 图 4-53 所 示 。 
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图 4-52 输入 文字 
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疯 图 误区 ， 和 解析 通常 一 些 常 多 犯错 的 人 御 析 图。 网 物 押 放 构 转 。 
BUR. 解析 调节 拍 人 物 、 拍 食物 以 及 甬 物 的 名 种 参数 。 
虱 轿 某 瑟 | 解析 信物、 拍 售 物 以 及 由 物 的 调 色 以 及 网 节 辅 姥 。 


长 按 二 维 码 ， 可 添加 个 人 微 信 


图 4-33 ”添加 取材 


和 邯 识 品读 


微 信 小 程序 ， 是 一 种 不 需要 下 载 安 装 即 可 使 用 的 应 用 ， 它 实现 了 应 用 “ 触 
手 可 及 ”的 梦想 ， 用 尸 扫 一 扫 或 者 搜 一 下 即 可 打开 应 用 。 它 的 出 现 将 会 让 应 用 
无 处 不 在 ， 随 时 可 用 ， 但 又 无 需 安装 邮 载 。 微 信 小 程序 将 成 为 一 个 新 的 热潮 。 


本 章 重 点 导航 

“ 柴 柴 的 零食 旗舰 店 ”小 程序 
设计 

@ “去 旅行 ”小 程序 设计 


| s pmpaawa I 8 < oy mm 
关上 深 东 中 零食 旗舰 店 X ”去 旅行 XE 
xy 
134 | =. ¿22 , 可 
全 部 商品 


攻略 酒店 机 票 旅行 商城 
游记 旅行 视频 问答 18088 
苏州 旅游 攻略 


坚果 系列 200g x 2# 


美味 营养 ， 新 鲜 如 叱 


— 分 类 我 的 订单 我 的 


新 媒体 美工 \mmemm >>>> 
5.1 ， “ 柴 荣 的 零食 旗舰 店 ” 小 程序 设计 
在 制作 食品 小 程序 界面 时 ， 运 用 楼 黄色 作为 背景 色 ， 各 活动 区 域 的 背景 色 则 可 采用 各 种 


鲜亮 的 颜色 ， 以 突出 活动 的 主题 以 及 食品 的 诱 人 特征 。 
本 实例 最 终 效果 如 图 5-1 所 示 。 


x 上柴 柴 太 零食 旗舰 店 X “ 柴 柴 四 零食 旗舰 店 
搜索 本 店铺 内 商品 k: Q misma 
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图 5-1 实例 效果 


扫 一 扫 观 看 在 线 视频 . 
上 某 荣 的 零食 旗舰 店 小 程序 设计 


专家 指点 > 


对 于 用 户 而 言 ， 一 款 应 用 程序 的 价值 在 很 大 程度 上 取决 于 功能 的 实用 性 。 因 此 ， 功 
能 越 实 用 的 小 程序 ， 赵 能 赢得 用 户 的 青睐 。 虽 然 在 运营 者 选择 领域 之 后 ， 小 程序 的 功能 
基本 上 已 经 确定 了 ,但 是 ， 如 果 用 户 是 初次 使 用 小 程序 ， 那么 ， 他 对 于 小 程序 实用 性 的 
感知 基本 上 来 自 小 程序 的 UI 界面 设计 。 

所 以 ， 运 营 者 在 设计 小 程序 界面 时 ， 应 尽 可 能 地 体现 其 功能 的 实用 性 。 这 一 点 对 于 
工具 类 小 程序 来 说 尤其 重要 。 当 然 ， 大 部 分 工具 类 小 程序 也 应 特别 注意 这 个 问题 。 


5.1.1 制作 店 招 与 搜索 框 效 果 O| 


下 面 详细 介绍 制作 小 程序 店 招 与 搜索 框 效 采 的 方法 。 
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选择 “文件 ”| “新建 ” 命 令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设 置 “ 名 称 ” 为 “ 柴 
上 各 的 零食 店 小 程序 设计 ”、“ 宽 度 ” 为 1080 像素 、“ 高 度 ” 为 1920 像素 、“ 分 辩 率 ”为 
300 像素 /英寸 “颜色 模式 ”为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 如 图 5-2 所 示 ， 
单 击 “ 创 建 ”按钮 ， 新 建 一 个 空白 图 像 。 
按 CtrltO 组 合 键 ， 打开“ 背景 1 jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
归 至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 和 大 小 ， 效 果 如 图 5-3 所 示 。 


| (O 最 这 使 用 项 已 保存 | 照片 ”打印 ” 图 往 和 手 图 Web 移动 设备 。 胶片 和 视频 


坚 需 折 佑 用 的 萝 目 (2) 


图 5-2 新 建 空白 文档 图 9-3 添加 背景 素材 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 ,设置 “字体 系列 ”为 “ 方 

正 细 黑 一 简体 ”、“ 字 体 大 小 ”为 14 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -<50、“ 颜 色 ”为 
黑色 (RGB 参数 值 均 为 0， 激活 仿 粗 体 图 标 ， 如 图 5-4 所 示 。 

选取 工具 箱 中 的 横 排 文 字 工具 ， 在 图 像 编辑 窗口 中 输入 文字 ， 如 图 5-5 所 示 。 


2 专家 指点 BS) 


在 食品 小 程序 界面 中 , 底部 一 般 为 一 些 常见 的 导航 按钮 , 包括 “首页 “购物 侧 ” 和 “我 
的 ”， 可 以 帮助 用 户 快速 进入 相应 的 界面 。 这 些 第 规 按 钮 是 指 可 以 响应 用 户 手 指点 击 的 
各 种 文字 和 图 形 ， 其 作用 是 对 用 户 的 手指 点 击 作出 反应 并 触发 相应 的 事件 。 

常规 按钮 (Button) 的 风格 可 以 不 一 样 ， 上 面 可 以 写 文 字 ， 也 可 以 标 上 图 片 ， 但 它们 
最 终 都 要 用 于 确认 、 提 交 等 功能 的 实现 。 

通常 情况 下 ， 按 钮 要 和 品牌 一 致 ， 拥 有 统一 的 颜色 和 视觉 风格 ， 在 设计 时 可 以 从 品 
牌 LOGO 中 借鉴 形状 、 材 质 以 及 风格 等 。 
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图 3-4 设置 字符 面板 图 5-5 输入 文字 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “ 华 康 
海报 体 W.”、“ 字 体 大 小 ”为 12 点 、“ 行 距 ” 为 12 点 、“ 颜 色 ” 为 黄色 (RGB 参数 值 分 
别 为 244、197、35)， 如 图 5-6 所 示 。 

在 图 像 编 辑 窗口 中 输入 相应 文字 ， 如 图 5-7 所 示 。 


i 
= Em = e 司 

= JE T| 

[| 地 点 v| + 全 |12 占 v 国 | 

Aa im X | 柴 柴 DD 零 食 旗舰 店 
| 

bus a x choichoi 

IT 100% K. 100% | _. 

, 
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图 >-6 设置 字符 面板 图 5-7 输入 文字 


选取 工具 箱 中 的 圆 角 矩形 工具 ， 在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “ 形 
状 ”、“ 填 充 ” 为 浅 灰色 (RGB 参数 值 均 为 234)、“ 描 边 ”为 无 、“ 半 径 ” 为 40 像素 ,在 图 
像 编 辑 窗口 中 的 适当 位 置 处 绘制 一 个 圆 角 和 抑 形 图 形 ， 如 图 5-8 所 示 。 
选取 工具 箱 中 的 椭圆 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 无 、“ 描 边 ”为 灰 


wd í í 


— 


小 程序 IE 
aaa 界面 广告 以 及 宣传 页 设计 | 


色 (RGB 参数 值 均 为 100)、“ 描 边 宽度 ”为 4 像素 , 在 图 像 编 辑 窗 口中 绘制 一 个 椭圆 ， 如 图 5-9 
所 示 。 


X 柴 柴 O) 零 食 旗舰 店 wh X ， 柴 柴 0O) 零 食 旗舰 店 
cn Ç ww ， 人 把 


chaichai 习 
= 134 P 
店铺 梧 先 全 部 商品 下 名 ”绘制 


图 5-8 绘制 圆 角 甜 形 框 图 5-9 ”绘制 椭圆 


设计 中 的 文字 颜色 是 可 以 随意 设置 的 ， 但 不 可 设置 单调 的 一 个 色 。 从 读者 的 阅读 体 
验 出 发 ， 将 设计 中 的 文字 颜色 设置 为 最 佳 的 颜色 是 非常 有 必要 的 ， 文 字 的 颜色 搭配 适宜 
是 让 设计 获得 吸引 力 的 有 效 方法 。Photoshop 中 的 文字 是 使 用 PostScript 信息 从 数学 上 定 
义 的 直线 或 曲线 来 表示 的 ， 如 果 没 有 设置 消除 锯 移 ， 文 字 的 边缘 便 会 产生 硬 边 和 锯齿 。 

所 以 在 输入 文字 时 ， 可 以 先 在 工具 属性 栏 或 “字符 ”面板 中 设置 消除 锯齿 的 方式 ， 
如 锐利 、 犀 利 、 浑 厚 、 平 滑 等 。 
2: S 09 选取 工具 箱 中 的 直线 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 灰色 (RGB 参数 值 
均 为 160). “HJH” 22 像素 ， 在 图 像 编辑 窗口 中 绘制 一 条 直线 ， 如 图 5-10 所 示 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
细 黑 一 简体 ”、“ 字 体 大 小 ”为 10 点 、“ 设 置 所 选 字 符 的 字 距 调整 ”为 -25、“ 颜 色 ” 为 灰 
色 (RGB 参数 值 均 为 160)， 激 活 仿 粗 体 图 标 ， 效 果 如 图 5-11 所 示 。 
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图 5-10 绘制 直线 图 >-11 设置 字符 面板 
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在 图 像 编 辑 窗 口中 的 适当 位 置 输入 相应 的 文字 ， 效 果 如 图 5-12 所 示 。 
按 CtrltO 组 合 键 ， 打 开 “ 文 字 1psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
眼 至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 5-13 所 示 。 


X | 柴 上 0 零食 旗舰 店 “ë. X 柴 柴 0 零食 旗舰 店 


S wë (搜索 本 店铺 内 商品 = Q 搜索 本 店铺 内 商品 
choichoi choich%oi 


店铺 精 选 店铺 精 选 全 部 商品 


199 减 100< | x 


99 元 一 大 箱 零 食 


图 5-12 输入 文字 图 9-13 添加 文字 素材 


5.1.2 制作 商品 活动 区 效果 


下 面 详细 介绍 制作 商品 活动 区 效 朱 的 方法 。 

按 CtrltO 组 合 键 ， 打 开 “ 甜 甜 圈 .jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
眼 至 背景 图 像 编辑 窗口 中 , 适当 地 调整 图 像 的 位 置 ， 将 图 层 放 置 最 底层 ， 效 打 如 图 5-14 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “ 字 从 ”面板 中 ,设置 “字体 系列 ”为 “ 方 
正 粗 圆 简 体 ”、“ 字 体 大 小 ” 为 21 点 、 设置 所 选 字符 的 字 距 调整 为 30、 颜色 为 日 色 (RGB 
参数 值 均 为 0)， 效 末 如 图 5-15 所 示 。 
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5-15 设置 字符 面板 
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专家 指点 


小 程序 是 一 种 不 需要 下 载 安装 即 可 使 用 的 应 用 ， 作 为 一 个 应 用 ， 它 会 有 自己 的 功能 
与 业务 ， 所 以 在 设计 时 要 注意 ， 所 有 的 内 容 ， 都 需要 围绕 着 主 营 业务 ， 这 样 可 以 让 用 户 
很 快 地 明白 小 程序 的 营销 内 容 ， 并 判断 出 是 否 有 自己 需求 的 东西 。 

在 图 像 编辑 窗口 中 的 适当 位 置 输入 相应 的 文字 ， 效 果 如 图 5-16 所 示 。 
按 Ctrl+oO 组 合 键 ， 打 开 “ 文 字 2psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
归 至 背景 图 像 编 辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 5-17 所 示 。 
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图 5-16 输入 文字 图 5-17 添加 文字 素材 


单 击 “ 图 层 ” 面 板 底 部 的 “创建 新 图 层 ” 按 钮 ， 新 建 图 层 ， 选 取 工 具 箱 中 的 朱 
形 选 框 工具 ， 在 图 像 编辑 窗口 中 绘制 一 个 矩形 选区 ， 如 图 5-18 所 示 。 

设置 前 景色 为 黄色 (RGB 参数 值 分 别 为 244、197、35)， 按 AlttDelete 组 合 键 
为 选区 填充 前 景色 ， 按 Ctrl+D 组 合 键 ， 取 消 选 区 ， 效 果 如 图 5-19 所 示 。 
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图 5-18 ”绘制 窍 形 选区 
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在 Photoshop 中 ， 新 建 图 层 的 方式 有 和 人 很多， 以 下 列举 了 两 种 常用 的 方法 。 
@ 快捷 键 : j ShiftrCtr-N 组 合 键 弹出“ 新建 图 后 ” 对 话 框 ， 单 击 “ 确 定 ” 按 和 鱼 ， 
即 可 新 建 图 层 。 
@ 命令 : 选择 “图 层 ”|“ 新 建 ”|“ 图 层 ” 命 令 , 弹出“ 新建 图 层 ” 对 话 框 ， 单 击 “ 确 
定 ”按钮 ， 即 可 新 建 图 层 。 
2307 选取 工具 箱 中 的 矩形 工具 ， 设 置 “ 填 充 ” 为 红色 (RGB 参数 值 分 别 为 222、 
32、58)、“ 摘 边 ” 为 无 、“ 半 径 ” 为 10 像素, 在 图 像 编 辑 窗口 中 绘制 一 个 大 小 合适 的 矩形 图 像 ， 
效果 如 图 5-20 所 示 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 ， 设 置 “字体 系列 ”为 “ 方 
正 粗 圆 简 体 ”、“ 字 体 大 小 ”为 11.5 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 50、“ 颜 色 ” 为 白 
色 (RGB 参数 值 均 为 0), 在 图 像 编 辑 窗口 中 输入 文字 并 调整 文字 的 位 置 ， 效果 如 图 5-21 所 示 。 
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图 3-20 ” 疆 制 算 形 框 图 5-21 输入 文字 
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与 创建 矩形 选 框 有 关 的 技巧 如 下 。 

@ j ShifttM 组 合 键 ， 可 快速 选择 矩形 选 框 工 具 。 

@ 按 Shift 键 ， 可 创建 正方 形 选 区 ， 

@ 按 Alt 键 ， 可 创建 以 起 点 为 中 心 的 矩形 选区 ， 

@ jz Alt+Shift 组 合 键 ， 可 创建 以 起 点 为 中 心 的 正方 形 选 区 。 
@ 按 Shift+A 组 合 键 ， 可 快速 沿 画 布 边 综 创 建 选区 。 
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5.1.3 制作 详情 页 推荐 效果 
下 面 详细 介绍 详情 页 推 存 的 方法 。 


按 Ctrl+O 组 合 键 ， 打 开 “ 文 字 2psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
忠 至 背景 图 像 编 辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 5-22 所 示 。 

按 CtrltO 组 合 键 ， 打开“ 坚果 .jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 蝶 
至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 和 大 小 ， 效 果 如 图 5-23 所 示 。 
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图 9-22 添加 文字 素材 图 5-23 ”添加 坚果 素材 


选取 工具 箱 中 的 横 排 文 字 工具 ， 在 “字符 ”面板 中 ， 设 置 “ 字 体系 列 ” 为 “ 华 
文 细 黑 ”、“ 字 体 大 小 ”为 12 点 、“ 行 距 ” 为 11 点 、 
激活 仿 粗 体 图 标 ， 效 果 如 图 5-24 所 示 。 


在 图 像 编辑 窗口 中 的 适当 位 置 输入 文字 ， 效 朱 如 图 5-25 所 示 。 


“颜色 ”为 黑色 (RGB 参数 值 均 为 0)， 
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图 5-24 ”设置 字 待 面板 


图 5-25 输入 文字 
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选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 ， 设 置 “字体 系列 ”为 “ 黑 
体 ”、“ 字 体 大 小 ”为 7 点 、“ 行 距 ” 为 11 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -5、“ 颜 色 ” 
为 黑色 (RGB 参数 值 均 为 )， 效 果 如 图 5-26 所 示 。 

在 图 像 编辑 窗口 中 的 适当 位 置 输入 文字 ， 效 果 如 图 5-27 所 示 。 
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图 2-26 ”设置 子 待 面板 图 5-27 输入 文字 


按 Ctrl+o 组 合 键 ， 打 开 “ 形 状 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 卢 
至 背景 图 像 编 辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 5-28 所 示 。 

选取 工具 箱 中 的 横 排 文 字 工具 ,在 “字符 ”面板 中 设置 “字体 系列 ”为 “黑体 ”、“ 字 
体 大 小 ”为 7 点 “行距” 为 11 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -5、“ 颜 色 ” 为 黑色 (RGB 
参数 值 均 为 0， 效果 如 图 5-29 所 示 。 
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图 5-28 添加 形状 素材 图 3-29 ”设置 字符 面板 
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把 小 程序 界面 的 配色 设计 好 ， 让 界面 更 好 看 一 点 、 更 漂亮 一 点 ， 这 样 就 会 在 视觉 上 
吸引 用 户 ， 给 小 程序 带 来 更 多 的 流量 。 小 程序 的 配色 首先 要 精简 ， 然 后 尽 可 能 地 反映 品 
牌 特性 。 对 于 进入 小 程序 的 用 户 来 说 ， 他 们 首先 会 被 界面 中 的 图 片 色彩 所 吸引 ， 然 后 根 
据 色 彩 的 走向 对 画面 的 主 次 逐一 地 进行 了 解 。 

另外 ， 为 了 让 用 户 快速 获知 页 面 中 的 信息 ， 在 设计 小 程序 界面 时 可 以 使 用 空间 和 组 
块 有 意识 地 突出 重点 内 容 ， 让 界面 看 上 去 更 加 干净 、 整 洁 。 

在 图 像 编 辑 窗口 中 的 适当 位 置 输入 相应 文字 ， 效 果 如 图 5-30 所 示 。 
EZ 110 按 Ctl+O 组 合 键 ， 打开 “价格 .psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 电 
至 背景 图 像 编 辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 5-31 所 示 。 
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图 5-30 输入 文字 图 5-31 添加 价格 素材 


按 Ctl+O 组 合 键 ， 打开 “新 品 标签 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 
拖 电 至 背景 图 像 编 辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 5-32 所 示 。 
按 Cul+O 组 合 键 ， 打 开 “ 抢 购 按 钮 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 
拖 电 至 背景 图 像 编 辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 5-33 所 示 。 


小 程序 是 一 种 不 需要 下 载 安装 即 可 使 用 的 应 用 ， 作 为 一 个 应 用 ， 它 会 有 自己 的 功能 
与 业务 ， 所 以 在 设计 时 要 注意 ， 所 有 的 内 容 都 需要 围绕 着 主 营业 务 来 转 ， 这 样 可 以 让 用 
户 很 快 地 明和 白 小 程序 的 营销 内 容 ， 并 判断 出 是 否 有 自己 需要 的 东西 。 为 了 更 全 面 地 展示 
商品 的 信息 ， 小 程序 中 的 商品 前 应 有 单独 的 详情 页 ， 用 户 只 需 单 击 自 己 中 意 的 商品 ， 即 
可 进入 详情 页 面 ， 查 看 更 多 关于 此 商品 的 信息 。 
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图 >-32 添加 标签 素材 图 5-33 ”添加 按钮 素材 


EZ713] 按 cul+o 组 合 键 ， 打 开 “ 功 能 按钮 psd” 素 材 图 像 ， 效 果 如 图 5-34 所 示 。 
于 14| 运用 移动 工具 将 素材 图 像 拖 虹 至 背景 图 像 编 辑 窗 口中 ,适当 地 调整 图 像 的 位 置 ， 
效果 如 图 5-35 所 示 。 
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图 5-34 ”打开 功能 按钮 素材 图 5-35 拖 忠 标签 素材 


在 Photoshop 中 打开 素材 的 方式 有 很 多 ， 以 下 列举 了 两 种 常用 的 方法 。 

@ 快捷 键 : 按 Ctrl+O 组 合 键 , 弹出 “文件 夹 ” 对 话 框 ， 找 到 素材 ,， 单 击 “ 确 定 ” 按 和 鱼 ， 
即 可 打开 素材 。 

@ 命令 : 选择 “文件 ” |“ 打开” 命令 ,弹出 “文件 夹 ” 对 话 框 ， 找 到 素材 ， 单 击 “ 确 
定 ” 按 钮 ， 即 可 打开 订 材 。 
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5.2 “去 旅行 ”小 程序 设计 


在 制作 旅游 小 程序 界面 时 , 采用 日 色 作为 背景 色 , 标题 栏 采 用 明亮 的 蓝 色 , 对 比 非常 清晰 ， 
绸 添加 色彩 丰富 的 来 单 图 标 ， 可 使 画面 整体 更 加 和 谐 。 
本 实例 最 终 效 朱 如 图 5-36 所 示 。 


图 2-36 ”实例 效果 


扫 一 扫 观 看 在 线 视频 , 
去 旅行 小 程序 设计 


5.2.1 制作 横幅 广告 背景 效果 JU 


下 面 话 细 介绍 旅行 小 程序 横幅 广告 育 凉 效 朱 的 设计 方法 。 

按 CtrltO 组 合 键 ， 打 开 “ 背 景 2jpg” 素 材 图 像 ， 如 图 5-37 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 , 选择 “窗口 ”| 字符 ”命令 , 打开 “字符 ”面板 ， 
设置 “字体 系列 ”为 “方正 准 圆 简体 ”、“ 字 体 大 小 ”为 12 点 、“ 颜 色 ” 为 黑色 (RGB 参数 
值 均 为 0)， 输 入 相应 的 文字 ， 如 图 5-38 所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 风 光 图 片 jpg” 素 材 图 像 ， 如 图 5-39 所 示 。 

选择 “图像 | 调整 -| “自然 饱和 度 ” 命令 , 弹出 “ 目 然 饱和 度 ” 对 话 框 , 设置 “ 目 
然 饱 和 度 ” 为 68， 如 图 5-40 所 示 ， 单 而 “确定 ”按钮 。 


站 媒体 美工 Y mwa FE es 六 六 六 六 
ea 


图 5-39 打开 素材 图 像 图 5-40 设置 “ 目 然 饱和 度 ” 参 数 


5.2.2 制作 模 幅 广告 文字 效果 | 


下 面 详细 介绍 旅行 小 程序 横幅 广告 文字 效果 的 设计 方法 。 
选择 “图 像 ”|“ 调 整 ”|“ 曲 线 ” 命 令 ， 弹 出 “曲线 ”对 话 框 ， 设 置 “输出 ” 
为 116、“ 输 入 ”为 98, 在 曲线 上 单 击 鼠标 左 键 新 建 一 个 控制 点 ， 如 图 5-41 所 示 , 单 击 “ 确 定 ” 
按钮 。 

选择 “图 像 ”|“ 调 整 ”|“ 可 选 颜色 ”命令 , 弹出 “可 选 颜色 ”对 话 框 , 设置 “ 红 
色 ” 各 参数 值 分 别 为 (0、-23、+4、-10)， 如 图 5-42 所 示 ， 单 击 “ 确 定 ”按钮 。 
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小 程序 . Ë 
界面 广告 以 及 宣传 页 设计 


i = © 六 C0-255)0) U P. a: s: 本 | ' ps — ER a ne EE Wea =m 
er 0 im(E)y | BE - í | 


BU E 总 [总 
臣 色 (D): mm 红色 


ne < n HE 
m= 自动 向 . 
(T... 


洋红 人 M): 


FEF: 
i iË TEYS[B) W Es (Y): 


加 mpi) = 黑色 (EB): 
Ë 至 绪 (B) 
"s 
方法 ， O 相对 [由 


图 5-41 设置 各 参数 图 5-42 设置 各 参数 


223 03| 运用 移动 工具 将 素材 图 像 拖 虹 至 背景 图 像 编 辑 窗 口中 ， 适 当地 调整 图 像 的 大 小 
和 位 站 ， “yaa 图 5-43 所 未 。 

04| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 ,设置 “字体 系列 ”为 “ 方 
一 字体 大 小 为 27 A. “颜色 22 (RGB 参数 值 均 为 0)， 在 图 像 编 辑 窗口 
中 的 适当 位 年 输入 文字 ， 如 图 5-44 所 示 。 


我 的 订单 


图 "-43 拖 忠 图 像 图 5-44 输入 文字 


5| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 ， 设 置 “ 字 体系 列 ” 为 “ 方 
a 、“ 字 体 大 小 ”为 18 点 、“ 颜 色 ” Sri na 参数 值 均 为 255)， 在 图 像 编 


辑 窗 口中 的 适当 位 置 输入 文字 ， 如 图 5-45 所 示 。 
适当 地 调整 各 图 像 的 位 置 ， 效 果 如 图 5-46 所 示 。 
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机 票 旅行 商城 


图 5-45 输入 文字 图 5-46 最 终 效果 
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在 移动 互联 网 时 代 ， 人 们 在 捕捉 信息 时 更 倾向 于 选择 各 种 资讯 类 的 新 媒体 
平台 ， 如 今日 头条 、 一 点 资讯 以 及 百度 新 闻 等 。 因 此 ， 企 业 和 自 媒体 人 在 进行 
营销 推广 时 ， 需 要 重点 针对 这 些 新 媒体 资讯 平台 进行 广告 设计 。 


本 章 重 点 导航 


头 亲 号 头像 设计 
© 


yG @% 4G.Alh Ë 52% 14:15 
发 私信 ，…: 


关注 热点 ”长沙 视频 社会 十 


长 沙 街头 的 女生 都 在 穿 什么 ? 


U 
¿aus 什么 是 新 媒体 平台 ? 跟 UI 有 什么 区 别 ? 

@ 认证 ; 视频 这 入 22 个 常见 问题 , 速 茂 

地 区 : 福建 省 厦门 市 — sas 

不 一 样 的 角度 不 一 样 的 体验 

1 888 H 


动态 。 文章 ; 


新 媒体 美工 Y ma = a > 
ER 完全 操作 手册 


6.1 头条 与 头像 估计 


头像 就 等 于 辨认 一 个 用 户 的 标准 ， 有 时 甚至 比 用 户 名 还 重要 ， 因 为 眼睛 一 般 是 先 读 图 ， 
而 不 征文 字 。 所 以 ， 一 个 有 特色 、 能 引 人 关 注 的 今日 头条 头像 ， 可 以 给 企业 带 来 更 多 的 关注 。 
本 实例 主要 介绍 企业 头条 号 的 头像 设计 ， 通 过 将 企业 的 品牌 LOGO 作为 头像 ， 加 深 品 牌 在 粉 
丝 心中 的 印象 。 

本 实例 最 终 效果 如 图 6-1 所 示 。 


ei 国 92%5 14:15 
发 私信 +° 


=e 
名 认证 : 视频 达 人 
@ 地 区 : 福建 省 厦门 市 
不 一 样 的 角度 不 一 样 的 体验 
1 天 注 888 万 粉皮 


动态 文章 视频 问答 小 视频 


w 


Se 


+ 


oE El A:i>C IU 
CAISESHIJUE 
图 6-1 实例 效果 
扫 一 扫 观 看 在 线 视频 . 
头条 与 头像 设计 


6.1.1 制作 企业 品牌 LOGO 主体 效果 | 
下 面 介绍 制作 头条 号 企业 品牌 LOGO 主体 效果 的 方法 。 
选择 “文件 /新 建 ” 命 令 , 弹出 “新 建文 档 ”对 话 框 ,在 其 中 设置 “名 称 ”“ 宽 度 ”“ 高 


度 ”“ 分 辨 率 、“ 颜 色 模式 ” “背景 内 容 ” 等 参数 ， 单 击 “ 创 建 ” 按 钮 ， 新 建 一 个 空白 画布 ， 
如 图 6-2 所 示 。 
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02| 选取 工具 箱 中 的 椭圆 工具 ， 在 工具 属性 栏 上 选择 工具 模式 为 “路 径 ”， 在 图 像 
388681 H ee 效果 如 图 6-3 所 示 。 


LOGO 在 企业 中 扮演 着 很 重要 的 角色 ， 它 可 以 代表 一 个 企业 的 形象 ，LOGO 的 设计 
很 重要 ， 要 与 企业 处 处 相关 联 ， 可 以 设计 成 抽象 性 、 具 象 性 以 及 非 图 案 字 体 性 三 种 。 


(D 二 EE 梧 用 项 已 保存 | 照片 ”打印 国 蒿 和 插图 Web 移动 设备 Be HIS 


图 6-2 “新 建文 档 ” 对 话 框 6-3 ”绘制 椭圆 路 径 


03| 选取 园 (转换 点 工具 )， 将 鼠标 指针 移 至 椭圆 路 径 的 上 方 锚 点 ， 此 时 鼠标 指针 
= ME, La 


04 单 击 鼠 标 左 键 ， 即 可 将 平滑 锚 点 转换 为 尖 突 锚 点 ， 效 果 如 图 6-5 所 示 。 


=Y rau A 
Í Í 
ç , 
图 6.4 ”鼠标 指针 的 形状 图 6-5 ”转换 锚 点 1 
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转换 点 工具 主要 用 于 转换 路 径 锁 点 的 属性 。 若 钢 点 为 类 突 锁 点 ， 运 用 转换 点 工 
具 在 锚 点 上 单 击 和 鼠标 左 键 并 拖 扩 ， 即 可 将 该 锚 点 转换 为 平滑 锁 点 ; 若 锁 点 为 平滑 销 点 ， 
则 在 该 锚 点 上 单 击 鼠标 左 键 ， 即 可 将 平滑 锚 点 转换 为 尖 突 锚 点 。 


参考 步骤 (3) 一 步骤 (5) 的 操作 方法 ， 将 椭圆 路 径 正 下 方 的 平 请 错 点 转换 为 尖 
突 锚 点 ， 效 果 如 图 6-6 所 示 。 
按 Ctrl+Enter 组 合 键 ， 将 路 径 转换 为 选区 ， 如 图 6-7 所 示 。 


1 x 


图 6-6 转换 销 点 2 图 6-7 将 路 径 转 换 为 选区 


新 建 “ 图 层 1” 图 层 ， 使 用 渐变 工具 为 选区 填充 RGB 参数 值 分 别 为 (37、 
253、195)(255、255、255) 的 两 色 线性 渐变 ， 如 图 6-8 所 示 。 
按 Ctrl+D 组 合 键 ， 取 消 选 区 ， 效 果 如 图 6-9 所 示 。 


ER 


` f 
` "i 


图 6-8 填充 线性 渐变 图 6-9 取消 选区 


双击 “图 层 1” 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “投影 ” 复 选 框 ， 各 选 
项 参数 设置 如 图 6-10 所 示 。 

22310 选中 “外 发 光 ” 复 选 框 ， 设 置 “ 发 光 颜 色 ” 的 RGB 参数 值 分 别 为 255、255、 
190， 各 选项 设置 如 图 6-11 所 示 。 
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图 6-10 设置 “投影 ”参数 图 6-11 设置 “外 发 光 ” 参 数 


28411 选中 “光泽 ” 复 选 框 ， 设 置 “ 效 果 颜 色 ” 的 RGB 参数 值 为 233、255、239， 
各 选项 参数 设置 如 图 6-12 所 示 。 

设 兽 完毕 后 单 击 “确定 按钮 , 即 可 为 图 像 洪 加 相应 的 图 层 梓 式 , 效 雪 如 图 6-13 
所 示 。 
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| 
等 高 屿 : 


图 6-12 ”设置 “光泽 ”参数 图 6-13 添加 图 层 样式 


按 CtrltO 组 合 键 ， 打开“ 高 光 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 蝶 至 当前 
图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 大 小 和 位 置 ， 效 果 如 图 6-14 所 示 。 
设置 “图 层 2” 图 层 的 混合 模式 为 “全 加 ”， 改 变 图 像 效 果 ， 如 图 6-15 所 示 。 
复制 “图 层 1” 图 层 和 “图 层 2” 图 层 , 将 复制 的 图 层 进行 合并 , 重新 命名 为 “ 花 
办 1”， 如 图 6-16 所 示 。 
复制 “ 花 准 1” 图 层 ， 得 到 “ 兹 办 1 拷贝 ”图 层 ， 按 Ctrlt+T 组 合 键 ， 调 出 变换 


控制 框 ， 效 末 如 图 6-17 所 示 。 
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图 6-14 添加 高 光 素 材 图 6-15 设置 图 层 混合 模式 
= - >= = 
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图 6-16 合并 图 层 图 6-17 调 出 变换 控制 框 


调整 中 心 控 制 点 的 位 置 ， 如 图 6-18 所 示 。 
在 工具 属性 栏 上 设置 “旋转 ”为 45 度 ， 效 果 如 图 6-19 所 示 。 


H: 100.00% < [s| ”| 度 H:0.00 E 


业 品 牌 LOGO 设 计 @ 100% (72881 拷贝, RGB/82) * 


图 6-18 调整 中 心 控 制 点 图 6-19 设置 角度 


图 像 随 之 进行 相应 角度 的 旋转 ， 按 Enter 键 ， 即 可 确认 图 像 的 旋转 ， 如 图 6-20 
所 示 。 


按 住 Ctrl 键 的 同时 ， 单 击 “ 花 办 2 拷贝 ”图 层 的 缩 览 图 ， 将 其 载 入 选区， 如 


N90 


DE 


CR 头像 以 及 推送 广告 设计 民 


图 0-21 所 示 。 


== = 


Pà < ElQ TE n 9 
正常 v 不 透明度 :|100% ~ 
锁定 : 图 Z + Pi @ 填 这 :100% ~ 


图 6-20 ”旋转 图 像 图 6-21 载 入 选区 


使 用 渐变 工具 为 选区 填充 RGB 参数 值 分 别 为 (255、0、0)(255、255、255) 的 
两 色 线 性 新 变 ， 如 图 6-22 所 示 。 


按 CtrltD 组 合 键 ， 取 消 选 区 ， 效 果 如 图 6-23 所 示 。 


图 6-22 填充 渐变 图 6-23 ”取消 选区 


> 专家 指点 


Photoshop 的 渐变 工具 在 色彩 秽 觉 方面 有 一 个 很 大 的 作用 ， 可 以 通过 很 多 种 颜色 渐变 
登 加 ,渐变 类 型 包括 “线性 渐变 C 径 向 渐变 “角度 渐变 “对 称 渐变 “C 蓉 形 渐变 , 
一 般 第 用 到 的 是 “线性 渐变 和 径 向 渐变 。 

在 处 理 图 像 色 彩 时 ， 面 对 一 个 单独 的 区 域 ， 颜 色 比 较 单 调 的 时 候 ， 用 己 可 以 使 用 渐 
变 工 具 对 图 像 进 行 渐变 填充 ， 以 获得 更 加 丰富 多 彩 的 效果 。 
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按 Ctrl+O 组 合 键 ,打开 “花瓣 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 虹 至 当前 
图 像 编 辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 6-24 所 示 。 

按 住 Shift 键 , 选中 所 有 的 图 层 , 单 击 最 下 方 “新 建 组 ”按钮 , 创建 “组 1” 图 层 组 ， 
如 图 6-25 所 示 。 
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图 6-24 添加 花瓣 素材 图 6-25 创建 组 


6.1.2 ”制作 企业 品牌 LOGO 字符 效果 | 


下 面 介绍 制作 头条 号 企业 品牌 LOGO 字符 效果 的 方法 。 
使 用 横 排 文字 工具 在 图 像 编辑 窗口 中 输入 符号 ， 在 “字符 ”面板 中 设置 “字体 


系列 ”为 “Adobe 黑体 Std”、“ 字 体 大 小 ”为 52 点 、 颜 色 的 RGB 参数 值 分 别 为 (5、144、0)， 
并 激活 仿 粗 体 图标 ， 如 图 6-26 所 示 。 

HT “EJE” | “HHI | “文字 ”命令 ， 将 文字 栅 格 化 ， 并 锁定 @ 图 层 的 透 
明 像素 ， 如 图 6-27 所 示 。 


P) 


输入 (@ 字符 主要 有 两 种 方法 ， 一 种 是 按 Shiftt2 组 合 键 ， 另 一 种 是 通过 软 键 盘 的 “ 特 
殊 符 号 ”选项 插入 该 字符 。 
使 用 渐变 工具 为 图 像 填充 RGB 参数 值 分 别 为 (0、3、144) (255、0、198) 的 径 
向 渐变 色 ， 效 果 如 图 6-28 所 示 。 
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双击 @ 图 层 , 弹 出 "图 层 样 式 ”对话 框 , 选 中 投影 " 复 选 框 , 各 选项 设置 如 图 6-29 
所 示 。 ⁄ 
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图 6-26 设置 字符 面板 图 6-27 锁定 @ 图 层 的 透明 像素 
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图 6-28 填充 渐变 色 图 6-29 设置 “投影 ”参数 
选中 “外 发 光 ” 复 选 框 ， 设 置 发 光 颜 色 的 RGB 参数 值 分 别 为 255、144、0， 
各 参数 设置 如 图 6-30 所 示 。 
选中 “光泽 ” 复 选 框 ， 设 置 效果 颜色 的 RGB 参数 值 分 别 为 246、242、222， 
各 参数 设置 如 图 6-31 所 示 。 
选中 “颜色 释 加 ” 复 选 框 ， 设 置 又 加 颜色 的 RGB 参数 值 分 别 为 255、255、 
255， 各 参数 设置 如 图 6-32 所 示 。 
设置 完毕 后 单 击 “ 确 定 ” 按 钮 , 即 可 为 字符 添加 图 层 样式 , 效果 如 图 6-33 所 示 。 
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图 6-30 设置 “外 发 光 ” 参 数 
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图 6-32 设置 “颜色 准 加 ”参数 图 6-33 应 用 图 层 桂 式 
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渐变 编辑 器 中 的 “位 置 ” 文 本 框 中 显示 标记 点 在 渐变 效果 预览 条 的 位 置 ， 用 户 可 以 
输入 数字 来 改变 颜色 标记 上 总 的 位 置 ， 也 可 以 直接 抑 捍 渐变 颜色 带 下 端的 颜色 标记 点 。 单 
+ Delete 键 可 将 此 闫 色 标 记 点 删除 。 

在 “ 预 设 ”选项 区 中 ， 前 两 个 渐变 色 块 是 系统 根据 前 景色 和 背景 色 自 动 设 置 的 ， 若 
用 户 对 当前 的 渐变 色 不 满意 ， 也 可 以 在 该 对 话 框 中 ， 通 过 渐变 滑 块 对 渐变 色 进 行 调整 。 


6.1.3 制作 企业 品牌 LOGO 文子 效果 WU 


下 面 介绍 制作 头条 号 企业 品牌 LOGO 文字 效果 的 方法 。 

选取 横 排 文字 工具 ， 在 图 像 编 辑 窗口 的 下 方 单 击 鼠标 左 键 并 拖 卡 ， 即 可 显示 一 
个 虚线 框 ， 至 合适 位 置 后 释放 鼠标 左 键 ， 即 可 得 到 一 个 文本 框 ， 并 且 有 一 个 闪烁 的 光标 ， 效 
傈 如 图 6-34 所 示 。 
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今日 头条 


CLK 头像 以 及 推送 广告 设计 此 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 


综 乙 简体 ”、 “字体 大 小 ”为 50 点 、“ 颜 色 ” 为 黑色 (RGB 参数 值 均 为 0), 效果 如 图 6-35 所 示 。 

” = = | 

= É = s= = 

Las se 

4 方正 综 世 简体 |v - |v| 

< @ p 并 5 点 aen |v| 

£ 4 Vo 四 | 

| tT 100% L100% | 

| 一 站 I At 0 点 je: W 

Š + 9 I T 7 pr Tr pip T P 

D----------------- [= a") 

图 6-34 ”创建 文本 框 图 6-35 设置 字符 面板 


在 图 像 编 辑 窗口 中 输入 相应 的 文字 ， 按 Enter 键 ， 文 字 光 标 切 换 至 另 一 行 ， 效 
来 如 图 6-36 所 示 。 


根据 需要 输入 中 文字 的 字母 拼写 ， 效 果 如 图 6-37 所 示 。 


Sasam ss as Sasu L. S. 


图 6-36 ”换行 图 6-37 输入 字母 


文本 框 通 第 运用 于 输入 文字 较 多 的 情况 下 ， 当 一 行 中 所 输入 的 文字 超过 文本 框 的 宽 
度 时 ， 将 自动 转换 至 下 一 行 。 在 文本 框 中 输入 文字 后 ， 可 以 根据 需要 对 文本 框 的 高 度 或 
宽度 进行 调整 ， 以 显示 未 显示 的 文字 。 
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05 使 用 横 排 文 字 工 具 选 择 文本 框 中 的 字母 拼写 ， 展开 “字符 ”面板 ,设置 “ 字 体 
系列 ” m kasa 简体 ”、“ 字 体 大 小 ”为 38 点 、“ 颜 色 ” 为 黑色 (RGB 参数 值 分 别 为 0. 
0、0)， 效 果 如 图 6-38 所 示 。 


展开 “字符 ”面板 ， 激 活 仿 粗 体 图 标 国 ， 如 图 6-39 所 示 。 


=> É = ë = 

| | 方正 综艺 简体  - | v| | 

| | 

ka op T v tA (8 Ç | 

| | VA w. | 

< @ > z — 

| < 0% x: | 

# ç ` | T 100% X. 100% x 
GEN 15C [U | rr | 
CAISESHIJUE x 
图 6-38 ”设置 字母 属性 效果 图 6-39 激活 仿 粗 图 标 


展开 “字符 ”面板 ， 选 中 中 文 文字 ， 设 置 “颜色 ”为 黄色 (RGB 参数 值 分 别 为 
224、171、69)， 调 整 中 文 文字 的 颜色 ， 效 果 如 图 6-40 所 示 。 
08| 展开 “字符 ”面板 ， 选 中 拼音 文字 ， 设 置 “颜色 ”为 黄色 (RGB 参数 值 分 别 为 
224、 171. En 调整 拼音 颜色 ， 效 果 如 图 6-41 所 示 。 


v. sx 
í ç & v 
了 = 
CAISESHIJUE 
CAISESHIJUE 
图 6-40 调整 中 文 文字 颜色 的 效果 图 6-41 调整 字母 拼 与 颜色 效果 


设置 完毕 后 ， 按 Ctrl+Enter 组 合 键 确认 ， 在 “字符 ”面板 中 设置 “行距 ”为 60 
点 ， 效 果 如 图 6-42 所 示 。 


打开 “段落 面板, 单 击 “ 居 中 对 齐 文本 ”按钮 二 ， 再 适当 地 调整 文字 的 位 置 ， 
本 实例 制作 完毕 ， 效 果 如 图 6-43 所 示 。 
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et 头像 以 及 推送 广告 设计 医 


Ó` 
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£ 十 
V 
=F L Abi" GE gl IA15C TE 
图 6-42 ”设置 行距 效果 图 6-43 ”最终 效果 


6.2 头条 推送 广告 设计 


在 制作 推送 广告 时 ， 先 打开 并 拖 蝶 素 材 图 像 ， 调 整 图 像 的 亮度 ， 输 入 相应 的 商品 信息 ， 
最 后 髓 将 图 像 拖 虚 至 今日 头条 界面 中 ， 即 可 完成 设计 。 
本 实例 最 终 效果 如 图 6-44 所 示 。 


L 积极 向 上 | 三 幸 考 研 | 2018 考 研 


关注 推荐 热点 长 沙 视频 社会 十 


长 沙 街头 的 女生 都 在 穿 什么 ? 


什么 是 新 媒体 平台 ? 跟 UI 有 什么 区 别 ? 
22 个 常见 问题 , 速 藏 ! | 
=== 


女装 全 场 8 折 ! 戳 这 里 ! 


图 6-44 ”实例 效果 


扫 一 扫 观看 在 线 视频 . 
推送 三 告 成 计 
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6.21 制作 推送 广告 背景 效果 JU 


下 面 详细 介绍 制作 推送 广告 主体 效果 的 方法 。 
选择 “文件 ”|“ 新 建 ” 命令 ， 弹出 “新 建文 档 ” 对 话 框 ， 设置 “名 称 ” 为 “ 推 
送 广 告 设计 ”、“ 宽 度 ”为 4630 像素 、“ 高 度 ” 为 2088 像素 、“ 分 辩 率 ”为 72 像素 /英寸 、“ 颜 
色 模 式 ” 为 “RGB 颜色 ”、 . 青 景 内 容 ” 为 “白色 ”， 如 图 6-45 所 示 ， 单 击 “ 创 建 ”按钮 ， 
新 建 一 个 空白 图 像 。 
展开 “图 层 ” 面 板 ， 新 建 “ 图 层 1” 图 层 ， 如 图 6-46 所 示 。 


| << x 

图 层 | 历史 记录 | 动作 = 

[ ew | Pa < 四 ET ° 
u 推送 广告 设计 下 党 v| SEBBEZ: |100% | ~ 


PsE: 图 Z + Pu 自 填充 : 100% ~ 


531 x 20 Ë 3E @ 72 ppi 


m= 
4630 x 2088 089Z#E (@ 72 ppi 


cç f Qa Q m q ü 
图 6-45 设置 各 项 参数 图 6-46 新建 图 层 


BE 本 汪 03| 选 择 “ 图 层 1” 图 层 ， 设 置 前 景色 为 黄色 (RGB 参数 值 分 别 为 255、246、0)， 
"Wes 组 合 键 填充 前 景色 ， 效 果 如 图 6-47 所 示 。 

Z S 04 选取 工具 箱 中 的 钢笔 工具 ， 新 建 “ 图 层 2” 图 层 ， 在 图 像 编 辑 窗口 的 左 侧 绘制 
一 个 大 小 合适 的 弯曲 路 径 ， 效 采 如 图 6-48 所 示 。 


图 6-47 填充 表 景 图 6-48 绘制 路 径 
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茹 到 05 | 绘制 完毕 后 ， 按 Ctrl+Enter 组 合 键 将 路 径 转 换 为 选区 ， 效 果 如 图 6-49 所 示 。 
四 到 到 06| 设 置 前 景色 为 黑色 (RGB 参数 值 分 别 为 0、0、0)， 按 AltrDelete 组 合 键 为 选区 
填充 前 景色 ， Ez CtrlHD 组 合 键 取 消 选区 ， 效 果 如 图 6-50 所 示 。 


图 6-49 转换 选区 图 6-50 填充 选区 


6.2.2 制作 推送 广告 文字 效果 | 

下 面 详细 介绍 制作 推送 广告 文字 效果 的 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 人 物 .jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 眼 
至 背景 图 像 编辑 窗口 中 ， 适 当地 调整 图 像 的 位 置 ， 效 果 如 图 6-51 所 示 。 

按 CtrlH 工 组 合 键 ， 展 开 色 阶 对 话 框 ， 输 入 色 阶 的 参数 分 别 为 (15、1.26 
230)， 单 击 “ 确 定 ”按钮 ， 效 果 如 图 6-52 所 示 。 


图 6-51 添加 人 人物 素材 图 6-52 调整 人 物 素 材 亮 度 


按 Ctl+J 组 合 键 复 制 人 物 图 层 ， 如 图 6-53 所 示 。 

按 Ctrl+T 组 合 键 调 出 变换 控制 框 ， 将 复制 图 层 水 平 翻 转 ， 适 当地 调整 图 像 的 
位 置 ， 效 果 如 图 6-54 所 示 。 

2 二; 河 05| 选取 工具 箱 中 的 矩形 工具 ， 设 置 “ 填 充 ” 为 无 、“ 描 边 ” 为 30 像素 、 描 边 颜 
k" 在 图 像 编 辑 窗口 中 绘制 一 个 大 小 合适 的 人 第 形 图 像 ， 效 果 如 图 6-55 所 示 。 
06| 选中 "年 形 17 形 状 图 层 , 单 击 鼠标 右键 , 在 弹出 的 快捷 菜单 中 选择 “ 栅 格 化 图 层 ” 
选项 ， ami 然后 使 用 橡皮 探 工 具 探 除 多 余 像 素 ， 效 果 如 图 6-56 所 示 。 
07| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
准 黑 ”、 pe 为 337 点 、“ 颜 色 ” 为 黑色 (RGB 参数 值 分 别 为 0、0、0)， 激 活 仿 粗 
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体 图 标 ， 如 图 6-57 所 示 。 
在 图 像 编 辑 窗口 中 输入 相应 的 文字 ， 如 图 6-58 所 示 。 


EE ”历史 记录 ”动作 


Pm ~ @ T Bp ° 
正常 v | 刺 j 透 明度 : 100% ~ 
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图 6-53 复制 素材 图 像 6-54 ”调整 素材 图 像 


6-56 ” 探 队 多余 像 素 


44 x 
字符 FEE P= UEse = 
m | v [Regular [v | 

| - 
zT tA 83) — Ç 
VA Ü % Ü ` 


图 6-57 ”设置 字符 面板 图 6-58 输入 文字 


mt i Q (Ñ LJ 
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今日 头条 . 
¿<<< 头像 以 及 推送 广告 设计 


双击 文字 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “投影 ” 复 选 框 ,设置 “混合 
模式 ”为 “正片 至 底 ”、“ 不 透明 度 ” 为 47%、“ 角 度 ”为 87 度 、“ 距 离 ” 为 28 像素 、“ 扩 
展 ” 为 14%、“ 大 小 ”为 43 像素 ， 效 果 如 图 6-59 所 示 。 

单 击 “确定 ”按钮 ， 添 加 “投影 ”效果 ， 如 图 6-60 所 示 。 


下 musu. 
Wm (ay: ( ! 92 IE Ü PFSOG (G) (O 


sg: = 3 L 
RE 二 r 
EIE12m Bs (u) 
WB SRL LIË Era, IB 
` FL. 


图 6-59 设置 “投影 ”参数 图 6-60 “投影 ”效果 
选取 工具 箱 中 的 横 排 文字 工具 ,在 “字符 ”面板 中 设置 “字体 系列 "为 “微软 雅 尖 ”、 
“字体 大 小 ”为 337 点 、“ 颜 色 ” 为 黑色 (RGB 参数 值 均 为 0， 激活 仿 粗 体 图 标 ， 如 图 6-61 
所 示 。 
在 图 像 编 辑 窗 口中 输入 相应 的 文字 ， 如 图 6-62 所 示 。 


€ 4 x 

字符 E= = 
| 微软 雅 黑 v| |Regular V 
区 337 点 | 这 | 折 动 | > 
VA = 0 m 


图 6-61 设置 字符 面板 图 6-62 输入 文字 


ee 


知识 导 话 
一 占 海 


点 资讯 目 媒 体 平 台 又 称 为 一 点 号 ， 是 由 一 点 资讯 推出 的 一 个 内 容 发 布 平 
台 ， 丰 富 的 内 容 再 加 上 独特 的 “兴趣 引擎 ”， 一 点 资讯 通过 移动 互联 网 技术 极 
大 地 提高 了 用 户 体 验 ， 这 对 于 互联 网 创业 者 来 说 ， 也 为 他 们 审 来 了 更 多 用 户 群 
体 ， 可 以 帮助 优秀 的 目 媒 体 人 更 快 地 找到 与 自己 匹配 的 粉丝 。 


本 章 重 点 导航 
O 主页 横幅 广告 设计 
© 元 旦 活动 广告 设计 
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简单 舞蹈 | 高 手 在 民间 | 电动 车 .. 
关注 TE 热点 ”长沙 视频 新 时 代 三 
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摄影 人 | 总 说 自己 不 会 ， 其 实 你 跟 专 业 摄影 
师 只 差 这 一 步 ! 


7 1 主页 横幅 广告 设计 


在 制作 一 点 资讯 平台 中 的 主页 横幅 广告 时 ， 先 调整 背景 图 像 的 颜色 并 适当 模糊 ， 再 输入 
文字 ， 为 文字 添加 图 层 样 式 ， 即 可 完成 设计 。 
本 实例 最 终 效 果 如 图 7-1 所 示 。 
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图 /-1 实例 效果 


扫 一 扫 观 看 在 线 视频 . 
主页 横幅 广告 设计 


7.1.1 制作 主页 横幅 广告 背景 效果 DD 

下 面 介绍 制作 一 点 资讯 平台 主页 横幅 广告 背景 的 方法 。 
以 CtliN 组 合 键 ,弹出 “新 建文 档 "对 话 框 ,设置 “名 称 为 “主页 模 幅 广 告 设计 ” 
“宽度 ”为 1080 像素 、“ 高 度 ” 为 271 像素 、“ 分 辩 率 ”为 300 像素 / 英寸、 “颜色 模式 ” 
为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 设 置 完成 后 单 击 “ 创 建 ”按钮 ， 如 7-2 所 示 ， 


新 建 一 个 空白 图 像 。 
按 Cal+O 组 合 键 打开“ 背景 Ljpg” 素 材 图 像 ， 如 图 7-3 所 示 。 


一 点 资讯 .| 月 
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图 /-< 设置 各 选项 图 7-3 打开 背景 素材 


选择 “窗口 ”|“ 调 整 ”命令 ， 展开 “调整 ”面板 ， 在 其 中 单 击 “ 曲 线 ” 按 钮 ， 
新 建 “ 曲 线 1” 调 整 图 层 ， 如 图 7-4 所 示 。 

在 展开 的 “属性 ”面板 中 ， 在 曲线 上 单 击 鼠 标 左 键 新 建 一 个 控制 点 ， 在 下 方 设 
置 “ 输 入 ”为 137、“ 输 出 ”为 122， 如 图 7-5 所 示 。 
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图 7-4 ”新建 调整 图 层 图 7-5 设置 各 参数 


此 时 图 像 的 亮度 随 之 下 降 ， 效 果 如 图 7-6 所 示 。 
在 “调整 ”面板 中 单 击 “自然 饱和 度 ” 按 钮 ， 新 建 “ 自 然 饱 和 度 1” 调 整 图 层 ， 
在 “属性 ”面板 中 ,设置 “自然 饱和 度 ” 为 50、“ 饱 和 度 ” 为 32， 效 果 如 图 7-7 所 示 。 
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图 7-6 ”图像 效 果 


步 又 按 ShiftrCtrltAltrE 组 合 键 , 过 印 可 见 图 层 , 得 到 图 层 1 图 层 , 如 图 7-8 所 示 。 


mr 08| 运用 移动 工具 将 素材 图 像 拖 虑 至 背景 图 像 编辑 窗口 中 ,适当 地 调整 图 像 的 位 置 ， 
效 采 如 图 7-9 所 示 。 
E= 通道 ” 路径 。 历史 记录 = 
D ena - Ll Q T Hi p 外 
正常 v | 不 透明 度 : 100% ~ 


psE: 国 Z + TS Ñ 填充 : 100% ~ 
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图 7-8 得 到 “图 层 1” 图 层 图 /-9 eE ER 


在 “图 层 1 选择 “ 滤 镜 "| 模糊 | 方 框 模糊 ”命令 , 弹出 “ 方 框 模糊 ”对 话 框 ， 
设置 “半径 ”为 8 像素 ， 如 图 7-10 所 示 。 


单 击 “ 确 定 按钮， 印 可 应 用 “ 方 框 模糊 ” 兰 锐 ， 效 未 如 图 7-11 所 示 。 
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图 7-10 设置 “半径 ”参数 图 7-11 ”图像 效 果 
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“ 方 框 模糊 ” 渡 镜 可 以 基于 相 邻 像素 的 平均 颜色 值 来 模糊 图 像 ， 生 成 类 似 于 方块 状 
的 特殊 模糊 效果 。“ 半 径 ” 值 可 以 调整 用 于 计算 给 定 像素 平均 值 的 区 域 大 小 。 


7.1.2 制作 主页 横幅 广告 文字 效果 | 


下 面 介绍 制作 一 点 资讯 平台 主页 横幅 广告 文字 效果 的 方法 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
大 黑人 简体 ”、“ 字 体 大 小 ”为 17.5 点 、“ 颜 色 ” 为 日 色 (RGB 参数 值 均 为 255)， 在 图 像 编 辑 
窗口 中 输入 文字 ， 如 图 7-12 所 示 。 

单 击 “ 图 层 ” 面 板 底 部 的 “添加 图 层 样 式 ” 按钮, 在 弹出 的 快捷 菜单 中 选择 “ 渐 
变 登 加 选项， 如 图 7-13 所 示 。 


图 7-12 输入 文字 图 /-13 kPE “WhsSz2 ek JHm  JklIm 


打开 “图 层 样 式 ” 对 话 框 ， 单 击 “ 点 按 可 编辑 渐变 ”按钮 ， 弹 出 “渐变 编辑 
器 ”对 话 框 ， 设置 渐变 色 为 红色 (RGB 参数 值 分 别 为 255、0、0) 到 黄色 (RGB 参数 值 分 别 为 
255、198、0) 到 红色 (RGB 参数 值 分 别 为 255、0、0) 的 线性 渐变 ， 如 图 7-14 所 示 。 
单 击 “确定 ”按钮 ， 返 回 “ 图 层 样式 ”对 话 框 ， 设 置 “ 不 透明 度 ” 为 100%、“ 样 
式 ” 为 “线性 、 “角度 为 90 度 ， 如 图 7-15 所 示 。 
选中 “投影 ” 复 选 框 ， 设 置 “不 透明 度 ” 为 75%、“ 距 离 ” 为 7 像素 、“ 大 小 ” 
为 5 像素 ， 如 图 7-16 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 即 可 为 文字 添加 相应 图 层 样式 ， 如 图 7-17 所 示 。 
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图 /-14 设置 色 标 颜色 图 /-15 设置 各 选项 
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渐变 编辑 器 中 的 “人 位置” 文本 框 中 显示 标记 点 在 渐变 效果 预览 条 的 位 置 ， 用 户 可 以 
输入 数字 来 改变 颜色 标记 总 的 位 置 ， 也 可 以 直接 拖 久 渐变 颜色 带 下 痪 的 颜色 标记 点 。 单 
击 Delete 键 可 将 此 颜色 标记 点 删除 。 在 “ 预 设 ”选项 区 中 ， 前 两 个 渐变 色 块 是 系统 根据 
前 景色 和 背景 色 自 动 设 置 的 ， 若 用 户 对 当前 的 渐变 色 不 满意 ， 也 可 以 在 该 对 话 框 中 ， 通 


过 渐变 滑 块 对 渐变 色 进 行 调整 。 
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图 /-16 设置 各 选项 图 /-1/ 应 用 图 层 杆 式 


按 Ctrl+O 组 合 键 ， 打开“ 横幅 广告 文字 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 
上 蝶 至 当前 图 像 编 辑 窗口 中 的 适当 位 置 ， 效 果 如 图 7-18 所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 企 业 LOGO.psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 眼 
至 当前 图 像 编 辑 窗口 中 的 适当 位 置 ， 效 果 如 图 7-19 所 示 。 
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图 /-18 添加 文字 素材 图 /-19 添加 LOGO 素材 


市 假日 一 直 都 是 企业 开展 活动 的 掉 机 ， 新 媒体 运营 者 也 需要 千 握 市 假日 活动 的 策划 要 点 ， 
只 有 这 样 才能 巧妙 地 借助 而 假 日 的 气氛 ， 顺 势 实现 活动 目标 。 本 实例 介绍 一 点 资讯 平台 中 的 
元 旦 活动 广告 设计 方法 ， 本 实例 最 终 效果 如 图 7-20 所 示 。 
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图 7-20 ”实例 效果 


元 旦 活动 广告 设计 


7.2.1 制作 商场 折扣 活动 页 面 主体 效果 
下 面 介 绍 制作 商场 折扣 话 动 页 面 主体 效果 的 方法 。 
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图 7-21 打开 素材 图 像 图 /-22 添加 素材 


“2” 为 20, 在 礼品 图 像 的 白色 区 域 创建 选区 ， 


7-23 创建 选区 图 7-24 删除 选区 内 的 图 形 


Je Ctrl+D 组 合 键 取消 选区 ， 按 Ctrl+T 组 合 键 调 出 变换 控制 框 ， 适 当地 调整 礼 
nn 人 的 大 小 位置 效果 如 图 7-25 所 示 。 

步骤 由 ”图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “外 发 光 ” 复 选 框 ， 设 
置 发 光 颜色 为 黄色 (RGB pe 别 为 255、245、212)， 其 他 参数 设置 如 图 7-26 所 示 。 
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图 /-25 Jë 83 nn EH 图 7-26 设置 “外 发 光 ” 参 数 


单 击 “确定 按钮 ， 诬 加 “外 发 沦 ”图 层 梓 式 ， 效 末 如 图 7-27 所 示 。 
打开 “黄色 波浪 .psd” 素材 图 像 , 运用 移动 工具 将 其 拖 蝶 至 背景 图 像 编 辑 窗 口中 ， 
选中 “图 层 2” 图 层 ， 在 图 层面 板 中 拖 虫 至 背景 图 层 的 上 面 一 层 ， 如 图 7-28 所 示 。 


图 7-27 添加 “外 发 光 ” 图 层 样式 效果 图 7-28 ”添加 黄色 波浪 素材 
7.2.2 制作 商场 折扣 活动 页 面 文 字 效 果 D 


下 面 介 绍 制作 商场 折扣 活动 页 面 文字 效果 的 方法 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “ 华 康 
海报 体 W...”、“ 字 体 大 小 ”为 30 点 、“ 颜 色 ” 为 白色 ， 如 图 7-29 所 示 。 

将 鼠标 移动 至 图 像 编辑 窗口 中 单 击 鼠 标 左 键 ， 输 入 文字 ， 按 Ctrl+Enter 组 合 键 
确认 输入 ， 选取 工 具 箱 中 的 移动 工具 ， 将 文字 移动 至 合适 位 置 ， 效 果 如 图 7-30 所 示 。 
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图 /-29 设置 “字符 ”属性 图 7-30 输入 文字 


在 菜单 栏 中 选择 “图 层 ”|“ 图 层 样式 ”|“ 渐 变 琶 加 ”命令 ,弹出 “图 层 样式 ” 
对 话 框 ， 设 置 “ 角 度 ” 为 90 度 ， 单 击 “ 渐 变 ” 色 块 ， 即 可 弹出 “渐变 编辑 器 ”对 话 框 ， 设 置 
渐变 颜色 0% 位 置 为 黄色 (RGB 参数 值 分 别 为 252、255、0)，75% rë 2 @, (RGB 参数 值 
分 别 为 2535、138、0)， 如 图 7-31 所 示 。 

单 击 “ 确 定 ”按钮 ， 即 可 返回 “图 层 样式 ”对 话 框 ， 选 中 “ 描 边 ” 复 选 框 ， 设 
置 “ 大 小 ”为 4 像素 、 “颜色 ”为 白色 ， 如 图 7-32 BUR, 
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图 /-31 “渐变 编辑 器 ”对 话 框 图 7-32 设置 “ 描 边 ”参数 


单 击 “确定 ”按钮 ， 即 可 制作 “ 描 边 ” 效 打 ， 如 图 7-33 所 示 。 
EZ 306 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
大 法 简体 ”、“ 字 体 大 小 ”为 16 点 、“ 颜 色 ” 为 白色 ， 如 图 7-34 所 示 。 
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图 7-33 “HMU SX 图 /-34 ”设置 字符 面板 


在 图 像 编辑 窗口 中 输入 相应 文字 ， 如 图 7-35 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 输入 相应 文字 ， 在 “字符 ”面板 中 设置 “字体 系 
列 ” 为 “方正 大 黑 简 体 ”、“ 字 体 大 小 ”为 24 点 、“ 颜 色 ” 为 白色 ,激活 仿 斜体 图 标 ， 如 
7-36 所 示 。 
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图 7-35 输入 文字 图 7-36 ”设置 字符 面板 


在 菜单 栏 中 选择 “图 层 ”|“ 图 层 样式 ”| “渐变 毒 加 ”命令 ， 弹 出 “图 层 样式 ” 
对 话 框 ， 设 置 “角度 ”为 90 度 ， 单 击 “ 渐 变 ” 色 块 ， 弹 出 “渐变 编辑 器 ”对 话 框 ， 设 置 渐变 
颜色 0% 位 置 为 杰 色 (RGB 参数 值 分 别 为 255、110、2)、50% 位 置 为 黄色 (RGB 参数 值 分 别 
为 252、255、0)、100% (y E DE € (RGB 参数 值 分 别 为 255、110、2)， 如 图 7-37 所 示 。 
单 击 “确定 ”按钮 ， 即 可 返回 “图 层 样式 ”对 话 框 ， 选 中 “ 摘 边 ” 复 选 框 ， 设 
置 “大 小 ”为 3 像素 、“ 颜 色 ” 为 白色 ， 如 图 7-38 所 示 。 


113 Z 


站 媒体 美工 Y ma = == sS SSS 


专家 指点 )) 


图 层 样 式 是 Photoshop 的 图 技 里 的 一 种 功能 ， 图 层 样式 的 功能 很 多 很 强大 ， 既 能 够 简 
单 快速 地 制作 有 立体 感 的 图 像 ， 也 能 够 制作 各 种 有 质感 的 图 像 。 

通过 不 同 的 图 层 样式 选项 可 以 模拟 出 各 种 神奇 的 效果 ， 当 设置 好 了 图 层 样式 并 且 应 
用 的 时 候 ， 它 会 随 着 文件 一 起 保存 下 来 。 
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图 /1-37 ”添加 图 层 样 式 图 /-38 设置 字符 面板 


单 击 “确定 ”按钮 , 运用 “渐变 到 加 ”和 “ 描 边 ”图 层 样式 , 效果 如 图 7-39 所 示 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
综艺 简体 ”、“ 字 体 大 小 ”为 12 点 、“ 颜 色 ” 为 白色 、“ 行 距 ” 为 20 点 ， 在 图 像 编辑 窗口 
中 输入 相应 文字 ， 效 果 如 图 7-40 所 示 。 
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Happy new year 
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图 7-39 应 用 图 层 样式 图 7-40 输入 文字 
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百度 新 闻 是 包含 海量 资讯 的 新 闻 服 务 平台 ， 真 实 反 映 每 时 每 刻 的 新 闻 热 点 。 
百度 作为 国内 最 大 的 流量 入 口 之 一 ， 也 可 以 说 是 新 媒体 营销 发 展 的 新 风口 。 本 
章 主 要 介绍 自 度 新 闻 平 台中 的 图 文 推 运 广告 各 优 销 语 动 设计 方法 。 


本 章 重 点 导航 


@ 图 文 推 达 广告 封面 设计 
双 十 一 ”促销 活动 页 面 设计 
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8.41 图 文 推 运 广告 封面 设计 


在 制作 百度 新 闻 的 图 文 推送 广告 封面 设计 时 ， 先 调整 背景 图 像 的 偏 色 现象 ,添加 相应 素 
材 并 模糊 背景 ， 营 造 出 真实 的 拍照 场景 和 景深 效果 ， 突 出 产品 的 特点 ， 最 后 输入 适当 的 宣传 
文字 ， 即 可 完成 图 文 推 送 广告 封面 的 设计 。 

本 实例 最 终 效 果 如 图 8-1 所 示 。 
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图 8-1 实例 效果 


扫 一 扫 观 看 和 在线 视 频 . 
图 文 推送 广告 设计 


.1.1 ”制作 广告 封面 背景 效果 


下 面 详细 介绍 制作 百度 新 闻 图 文 推送 广告 封面 背景 效果 的 方法 。 
按 Ctrl+o 组 合 键 ， 打 开 “ 封 面 背 景 1.jpg” 素 材 图 像 ， 如 图 8-2 所 示 。 
按 CtrlLHM 组 合 键 , 弹 出 “曲线 ? 对话 框 , 在 曲线 上 单 击 鼠 标 左 键 新 建 一 个 控制 点 ， 


在 下 方 设 是 “输入 ”为 150、 输出 为 120， 如 图 8-3 所 示 。 
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图 8-2 打开 素材 图 像 图 8-3 设置 各 参数 


“曲线 ”命令 是 功能 强大 的 图 像 校 正 命令 ， 该 命令 可 以 在 图 像 的 整个 色调 范围 内 调 
整 不 同 的 和 色调， 还 可 以 对 图 像 中 的 个 别 颜 色 通 道 进 行 精确 的 调整 。 在 Photoshop F, BH) 
使 用 “曲线 ”命令 可 以 只 针对 一 种 色彩 通道 的 色调 进行 处 理 , 而 且 不 影响 其 他 区 域 的 色调 。 


单 击 “ 确 定 ” 按 钮 ， 即 可 运用 “曲线 ”调整 图 像 亮 度 ， 效 果 如 图 8-4 所 示 。 
按 CtrlitB 组 合 键 , 弹出 “色彩 平衡 ”对 话 框 , 设置 “ 色 阶 ” 各 参数 值 分 别 为 (20、 
+ -12), 如 图 8-5 所 示 。 
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图 8-5 设置 “色彩 平衡 ”各 参数 
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选择 “图 像 ”|“ 调 整 ”| “曲线 ”命令 ， 也 可 以 快速 弹出 “曲线 ”对 话 框 。 另 外 ， 若 
按 住 Alt 键 的 同时 ， 在 对 话 框 的 网 格 中 单 击 和 据 标 ， 网 格 显示 将 转换 为 10 Xx 10 的 网 格 显示 
比例 , 再 次 按 住 Alt 键 的 同时 单 击 鼠 标 左 键 , 即 可 恢复 至 默认 的 4x4 的 网 格 比 例 显示 状态 。 


单 击 “ 确 定 ” 按 钮 ， 即 可 运用 “色彩 平衡 ”调整 图 像 过 于 偏 深 的 颜色 ， 效 有 果 如 
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图 8-6 所 示 。 
选择 “图 像 ”| “调整 "| “自然 饱 和 度 ” 命令 , 弹出 “自然 饱和 度 ” 对 话 框 , 设置 “ 自 
然 饱 和 度 ” 为 60， 单 击 “确定 ”按钮 ， 提 高 图 像 色 彩 的 饱和 度 ， 效 果 如 图 8-7 所 示 。 


图 8-6 ”图像 效果 图 8-7 提高 图 像 饱 和 度 


> 


“自然 他 和 度 ” 命 令 可 以 调整 整 幅 图 像 或 单个 颜色 的 饱和 度 和 亮度 值 。 


8.1.2 ”制作 广告 封面 主体 效果 OD 


下 面 详细 介绍 制作 百度 新 闻 图 文 推送 广告 封面 主体 效果 的 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 手 机 .jpg” 素 材 图 像 ， 如 图 8-8 所 示 。 

Ec Ctrl+J 组 合 键 , 复制 “背景 ”图 层 , 得 到 “图 层 1” 图 层 , 并 隐藏 “背景 ”图 层 ， 
如 图 8-9 所 示 。 
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图 8-8 打开 素材 图 像 图 8-9 复制 图 层 
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选取 工具 箱 中 的 磁性 套 索 工具 , 沿 着 手机 边缘 拖 电 将 手机 选中 , 如 图 8-10 所 示 。 
按 CtrlHJ 组 合 键 , 复制 选区 中 的 图 像 , 得 到 “图 层 2” 图 层 , 再 将 其 他 图 层 隐藏 ， 
如 图 8-11 所 示 。 


图 层 。 历史 记录 ”动作 


D 类 型 v J Q T Hi D 
正常 v| 予 笛 明度 :| 100% | 
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图 8-10 ”选中 青 景 图 像 图 5-11 隐 沽 图 技 


专家 指点 


在 移动 选区 的 过 程 中 , 按 住 Shift 键 的 同时 ， 可 沿 水 平 、 垂 直 或 43” 角 方向 进行 移动 ， 
若 使 用 键盘 上 的 4 个 方向 键 来 移动 选区 ， 按 一 次 键 移动 一 个 像素 ， 若 按 Shift+ 方向 键 组 
合 键 ， 按 一 次 键 可 以 移动 10 个 像素 的 人 位置， 车 按 住 Ctrl 键 的 同时 并 拖 复 选区 ， 则 可 移动 
选区 内 的 图 像 。“ 取 消 选择 ”命令 相对 应 的 快捷 键 为 Ctrl+D 组 合 键 。 


隐藏 “图 层 1” 图 层 ， 选 取 工具 箱 中 的 集 形 选 框 工具 ， 在 手机 内 创建 一 个 选区 ， 
按 Delete 键 删除 选区 内 图 像 ， 效 末 如 图 8-12 所 示 。 

Ez Ctrl+tD 组 合 键 ,取消 选区 ， 运 用 移动 工具 将 素材 图 像 拖 蝶 至 背景 图 像 编 辑 
窗口 中 ， 适 当 调 整 图像 的 大 小 和 人 位置， 效果 如 图 8-13 所 示 。 
选取 工具 箱 中 的 魔 棒 工具 ， 选 中 部 分 图 像 ， 如 图 8-14 所 示 。 
在 “图 层 ” 面 板 中 选中 “背景 ”图 层 ， 在 选区 内 单 击 鼠标 右键 ， 在 弹出 的 快捷 
菜单 中 选择 “通过 拷贝 的 图 层 ” 选 项 ， 如 图 8-15 所 示 。 
执行 上 述 操作 ， 即 可 复制 选区 内 的 图 像 ， 得 到 “图 层 2” 图 层 ， 如 图 8-16 所 示 。 
选中 “背景 ”图 层 , 选择 “ 滤 镜 ”| 模糊 ”| “ 方 框 模糊 ”命令 ,弹出 “ 方 框 模糊 
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对 话 框 ， 设 置 “ 半 径 ” 为 8 像素， 单 击 “ 确 定 ” 按 钮 ， 效 采 如 图 8-17 所 示 。 


图 8-12 删除 图 像 图 8-13 拖 蝶 图 像 


8-14 选中 部 分 图 像 8-15 选择 “通过 拷贝 的 图 层 ” 选 项 
EE | 历史 记录 。 动作 = 
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图 8-16 得 到 “图 层 2” 图 层 图 8-17 ”图像 效果 
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8.1.3 ”制作 广告 封 面 文案 效果 O| 


下 面 详细 介绍 制作 百度 新 闻 图 文 推送 广告 封面 文案 效 朱 的 方法 。 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “ 方 
正 细 圆 简体 ”、“ 字 体 大 小 ”为 9 点 、“ 行 距 ” 为 20 点、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 
255)， 激 活 仿 粗 体 图 标 ， 在 图 像 编 辑 窗口 中 输入 文字 ， 如 图 8-18 所 示 。 


复制 刚刚 输入 的 文字 ， 移 至 合适 位 置 ， 如 图 8-19 所 示 。 
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前 置 4000 万 像素 | 前 置 4000 万 像素 x 
成 就 大 片 既 视 感 “| 、NA ' 成 就 大 片 既 视 感 ”| xn 
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, | - 42 复制 文本 
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图 8-18 输入 文字 图 8-19 复制 文字 


在 “字符 ”面板 中 设置 “字体 大 小 ”为 8 点 ， 如 图 8-20 所 示 。 
za 304 运用 横 排 文字 工具 修改 文本 内 容 ， 如 图 8-21 所 示 。 
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图 8-21 修改 文本 内 容 


图 8-20 ”设置 字体 大 小 
步骤 选中 “MOGUOX10” 文 字 , 在 “字符 ”面板 中 设置 “字体 系列 ”为 “华文 细 黑 ”， 

按 Ctrl+Enter 组 合 键 确认 输入 ， 如 图 8-22 所 示 。 
“g. 


选择 工具 箱 中 的 横 排 文字 工具 输入 相应 的 文字 , 然后 选中 “系列 ”文字 , 在 
符 ” 面 板 中 设置 “字体 大 小 ”为 6.5 点 ， 确 认输 入 ， 适 当 调 整 位 置 ， 效 果 如 图 8-23 所 示 。 
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图 8-22 ”设置 字体 系列 效果 图 8-23 ”调整 字体 大 小 效果 


选取 工具 箱 中 的 圆 角 秆 形 工 具 ， 在 工具 属性 栏 中 设置 “填充 ”为 黄色 (RGB Z 
数值 分 别 为 255、204、0)、“ 描 边 ” 为 无 、“ 半 人 径 ”为 10 像素 ,在 图 像 编辑 窗口 中 绘制 一 
个 圆 角 和 矩形， 如 图 8-24 所 示 。 
选中 “ 圆 角 和 矩形 1” 形 状 图 层 ， 单 击 女 标 右键 ， 在 弹出 的 快捷 菜单 中 选择 “ 混 
合 选 项 ”选项 ， 弹 出 “图 层 样 式 ” 对 话 框 ， 选 中 “斜面 和 浮雕 ” 复 选 框 ， 设置 “深度 ”为 
43%、“ 大 小 ”为 5 像素、“ 和 角度” 为 90 度 ， 如 图 8-25 所 示 。 
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图 8-24 zZ#ül[lF EE 8-25 设置 各 选项 


SP 专家 指点 s ) 


隐藏 图 层 样 式 可 以 使 用 以 下 3 种 操作 方法 : 

@ 在 图 层 面板 中 单 击 图 层 样 式 名 称 “ 切换 所 有 图 层 效 果 可 见 性 ” 图标， 可 将 显 
示 的 图 层 样 式 进行 隐藏 。 

@ 在 任意 一 个 图 层 样式 名 称 上 单 击 鼠标 右键 ， 在 弹出 的 菜单 列表 中 选择 “隐藏 所 有 
效果 ”选项 即 可 隐藏 当前 图 层 样 式 效果 。 

e@ 在 图 层 面板 中 单 击 所 有 图 层 样式 上 方 “ 效 果 ” 左 侧 的 眼睛 图 标 ， 即 可 隐藏 所 
有 图 层 样式 效果 。 
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单 击 “ 确 定 按钮 ， 印 可 应 用 “斜面 和 诅 膨 图 层 样 式 ， 效 末 如 图 8-26 所 示 。 
按 Ctrl+O 组 合 键 ， 打 开 “ 标 志 .psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
眼 至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 8-27 所 示 。 


前 置 4000 万 像素 x 前 置 4000 万 像素 
成 就 大 片 妈 视 感 “| k 成 就 大 片 既 视 感 。 |、 
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图 8-26 ”应 用 “斜面 和 浮雕 ”图 层 样式 图 8-27 适当 调整 图 像 的 位 置 


在 “ 儿 面 和 浮雕 ”图 层 样式 选项 设置 中 ， 在 “光泽 等 高 线 ” 选 项 中 可 以 选择 一 个 等 
高 线 样式 ， 为 斜面 和 浮雕 表面 添加 光泽 ， 创 建 具有 光泽 感 的 金属 外 观 浮雕 效果 。 


8.2 ““ 双 十 一 ”促销 活动 页 面 设 计 


每 年 的 “ 双 十 一 ”期 间 ， 各 个 电 商 企业 的 设计 师 们 可 是 钾 足 了 劲 儿 ， 各 种 海报 设计 可 谓 
琳琅 满目 、 应 接 不 上 暇 。 在 百度 新 闻 平 台 上 做 “ 双 十 一 ”促销 活动 ， 目 的 自然 是 传递 商品 信息 ， 
因此 往往 会 用 到 文字 , 运用 好 文字 就 可 制作 出 一 幅 成 功 的 话 动 海报 。 本 实例 最 终 效果 如 图 8-28 
所 示 。 


图 8-28 ”实例 效果 
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扫 一 扫 观 看 在 线 视频 . 
双 十 一 促销 活动 贝 面 设 计 


8.2.1 制作 “ 双 十 一 ”促销 活动 页 面 主体 效果 JW 


lacus pv earmig rt 

1| 按 Ctrl+o 组 合 键 ， 打 开 一 幅 素材 图 像 ， 如 图 8-29 所 示 。 

02| 选取 工具 箱 中 的 自 定形 状 工 具 ， 在 工具 属性 栏 中 设置 “填充 ”为 构 色 (RGB 参 
ge a. 
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et 
图 8-29 ”打开 素材 图 像 图 8-30 ”选择 相应 形状 


2 Sin s s 


路 径 是 Photoshop CC 中 的 各 项 强大 功能 之 一 ， 它 是 基于 “ 贝 塞 尔 ”曲线 建立 的 矢量 
图 形 ， 所 有 使 用 矢量 绘图 软件 或 矢量 绘图 制作 的 线条 ,原则 上 都 可 以 称 为 路 径 。 路 径 是 
通过 钢笔 工具 或 形状 工具 创建 出 的 直线 和 曲线 ， 因 此 ， 无 论 路 径 缩小 或 放大 部 不 会 影响 
其 分 辩 率 ， 并 保持 原样 。 
在 图 像 编 辑 窗口 中 单 击 鼠标 左 键 , 即 可 弹出 “创建 自 定形 状 ” 对 话 框 , 设置 “ 宽 
度 ” 为 298 像素 、“ 高 度 ” 为 119 像素 ， 如 图 8-31 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 即 可 创建 自 定形 状 ， 效 果 如 图 8-32 所 示 。 


可 Photoshop 中 ， 使 用 自 定 形状 工具 | 营 , 可 以 通过 设置 不 同 的 形状 来 绘制 形状 路 径 或 
图 形 ， 在 “ 自 定形 状 ” 拾 色 器 中 有 大 量 的 特殊 形状 可 供 选择 。 


° C 
ó: 
€p 


本 8Oxa 


— _ _ _ _ N124 


— 


百度 新 闻 : 
图 文 推送 广告 及 促销 活动 设计 


所 示 。 
选取 工具 箱 中 的 移动 工具 ， 将 形状 调整 至 合适 位 置 ， 如 图 8-34 所 示 。 


8-34 调整 位 置 


图 8-33 翻转 形状 


Photoshop 中 的 形状 工具 包括 矩形 工具 、 圆 角 徐 形 工具 、 椭 圆 工 具 、 多 边 形 工 具 、 直 
线 工 具 和 自 定形 状 工具 6 种 。 在 使 用 这 些 工具 绘制 路 径 时 ， 首 先 需要 在 工具 属性 栏 中 选 
择 一 种 绘图 方式 。 例 如 ， 选 取 工 具 箱 中 的 矩形 工具 ， 在 工具 属性 栏 中 ， 单 击 “ 选 择 工 具 
模式 ”按钮 $， 在 弹出 的 列表 框 中 选择 “形状 ”选项 ， 在 图 像 编 辑 窗 口 的 适当 位 置 处 ， 单 
击 鼠 标 左 键 并 拖 押 ， 即 可 创建 矩形 形状 路 径 。 


8.2.2 制作 “ 双 十 一 ”促销 活动 页 面 文字 效果 O 


下 面 介 绍 制作 “ 双 十 一 ”促销 活动 页 面 文字 效 采 的 方法 。 
展开 “字符 面板 ， 设置 “字体 系列 为 “类 体 、 字体 大 小 为 36 点 、 设 
置 行距 ”为 36 点 、“ 颜 色 ” 为 白色 ， 激 话 仿 粗 体 图 标 ， 如 图 8-35 所 示 。 
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选取 工具 箱 中 的 横 排 文字 工具 ， 在 工具 属性 栏 中 设置 “设置 消除 锯齿 的 方法 ” 
为 “浑厚 ”， 并 输入 文字 ， 效 果 如 图 8-36 所 示 。 


图 8-35 设置 “字符 ”属性 图 8-36 输入 文字 


按 Ctrl+O 组 合 键 ， 打 开 “ 文 字 1.psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
忠 至 背景 图 像 编辑 窗口 中 的 合适 位 置 ， 效 采 如 图 8-37 所 示 。 

Fe Ctrl+O 组 合 键 ， 打 开 “ 文 字 2psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
卡 至 背景 图 像 编 辑 窗口 中 的 合适 位 置 ， 效 朱 如 图 8-38 所 示 。 


图 8-37 添加 文字 素材 图 8-38 添加 文字 素材 


按 CtrltO 组 合 键 ， 打 开 “ 装 饰 条 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
蝶 至 背景 图 像 编辑 窗口 中 的 合适 位 置 ， 效 果 如 图 8-39 所 示 。 

按 Ctrl+O 组 合 键 ， 打开“ 礼物 jpg” 素 材 图 像 ， 效 果 如 图 8-40 所 示 。 

选取 工具 箱 中 的 魔 棒 工 具 ， 选 中 图 片 白 色 区域 ， 如 图 8-41 所 示 。 

按 CtrlH+ShifttI 组 合 键 , 反 向 选择 , 然后 复制 “背景 ”图 层 , 得 到 “图 层 1” 图 层 ， 


如 图 8-42 所 示 。 
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图 8-39 添加 季 饰 条 素材 图 8-40 ”打开 礼物 素材 图 像 
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图 8-41 选择 魔 棒 工具 图 8-42 得 到 “图 层 1” 图 层 


双击 “图 层 1” 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “外 发 光 ” 复 选 框 ， 颜 
色 RGB 值 分 别 为 255、249、211， 各 选项 设置 如 图 8-43 所 示 。 

EZ 110 单 击 “确定 ”按钮 ， 运 用 移动 工具 将 素材 图 像 拖 蝶 至 背景 图 像 编辑 窗口 中 的 合 
适 位 置 ， 适 当 调整 图 像 的 大 小 ， 效 果 如 图 8-44 所 示 。 

在 “图 层 ” 面板 中 单 击 “ 创 建新 图 层 ” 按钮 , 得 到 “图 层 5” 图 层 , 如 图 8-45 所 示 。 

选择 工具 箱 中 的 画笔 工具 ， 在 工具 属性 栏 中 设置 “画笔 大 小 ”为 70 像素 、“ 硬 
度 ” 为 0%98、“ 不 透明 度 ” 为 41%， 在 礼物 的 下 方 涂抹 添加 黑色 的 阴影 ， 效 果 如 图 8-46 所 示 。 
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图 8-43 设置 各 项 参数 
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图 8-45 ”创建 新 图 层 
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图 8-44 ”调整 图 像 


8-46 ”制作 阴影 效果 


知识 导读 


新 浪 微 博 是 一 个 由 新 浪 网 推出 的 社交 服务 平台 ， 为 用 户 提供 微型 博客 类 服 
务 ， 由 于 发 布 字数 限制 在 140 字 以 内 ， 又 被 称 为 “一 句 话 博客 ”。 新 浪 微 博 是 
个 大 舞台 ， 每 个 人 都 可 以 在 上 面 发 布 自己 的 精彩 内 容 。 


本 章 重 点 导航 
O 微 博 主 图 广告 设计 
O 微 博 推送 广告 设计 


dG lll 386 $p IS El O 16:32 @ HD =; 51% Cam | leullacull 0.5K/s@ — 16:22 Z @ =. 19% C 
< LEMO Q `: 添加 好 友 我 设置 
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微 博 钱包 TE sx nj) 粉 些 头条 客服 中 心 
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和 小 编 一 起 感受 各 地 美食 吧 
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91 微 博 主 图 广告 设计 


在 制作 微 博 主 图 时 ， 应 先 为 背景 填充 纯色 ， 再 单独 设计 产品 ， 加 强 产 品 图 片 的 吸引 力 ， 
最 后 设计 文案 效果 ， 通 过 层次 分 明 的 文字 突出 产品 的 价格 和 特色 。 
本 实例 最 终 效果 如 图 9-1 所 示 。 


d46ulll 38K b [8 E] O 16:32 @ HD =; 51% — m 


LEMO 
冰川 套装 


让 每 一 寸 肌 肤 


补水 充足 
LEMO 珠 穆 朗 玛 补 水 系列 


¥148.00 起 


图 9-1 实例 效果 


扫 一 扫 观 看 在 线 视频 : 
牧 博 主 图 广告 设计 


9.1.1 制作 微 博 主 图 主体 效果 VY 


下 面 介绍 制作 微 博 主 图 主体 效果 的 方法 。 
选择 “文件 ”|“ 新 建 ” 命 令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设置 “名 称 ” 为 “ 微 
博 主 图 设计 ”、“ 宽 度 ” 为 500 像素 、“ 高 度 ” 为 500 像素 、“ 分 辩 率 ”为 300 像素 /英寸 、 
“颜色 模式 ”为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 如 图 9-2 所 示 ， 单 击 “ 创 建 ” 按 钮 ， 
新 建 一 个 空白 图 像 。 

展开 “图 层 ” 面 板 ， 新 建 “图 层 1” 图 层 ; 设置 前 景色 为 浅 灰 色 (RGB 参数 值 
均 为 238)， 为 “图 层 1” 图 层 填充 前 景色 ， 如 图 9-3 所 示 。 
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x 新 浪 微 博 : 
主 图 广告 与 推送 广告 设计 
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(D #ii= Fani 已 保存 有 照片 打印 图 粮 机 捕 疼 Web 稳 动 设 稿 Ez A 


图 9-2 新 建 空白 图 像 图 9-3 填充 前 景色 


按 Ctrl+O 组 合 键 ， 打 开 “ 化 妆 品 .psd” 素 材 图 像 ， 如 图 9-4 所 示 。 
按 Ctrl+M 组 合 键 ,弹出 “曲线 ”对 话 框 ,设置 曲线 值 “ 输 出 ”为 146、“ 输 入 ” 
为 124， 如 图 9-5 所 示 。 


iri B 
O 光 (0-255)(L) 


L) FuFU2B3E %(6) 


| 预 设 (RJ: | 自 定 ~ @- 
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显示 : 
通道 于 加 上 
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预览 (P) 


_| 显示 修 砚 (W) 


图 9-4 打开 素材 图 像 图 9-5 调整 素材 的 腕 度 


单 击 “确定 ”按钮 ， 调 整 图 像 的 亮度 ， 效 朱 如 图 9-6 所 示 。 

选择 图 像 | 调整 | “自然 饱和 度 ” 命令 , 弹出 “自然 饱和 度 ” 对 话 框 , 设置 H 
然 吧 和 度 ”为 50、 饱和 度 为 11， 单 击 “确定 按钮 ， 效 霖 如 图 9-7 所 示 。 

选择 “图 像 | 调整 |“ 亮度/ 对比度” 命令 ， 弹 出 “亮度 /对比 度 ” 对 话 框 ， 
设置 “亮度 为 6、 “对比度 ”为 -10， 如 图 9-8 所 示 。 

单 击 “ 确 定 ” 按 钮 ， 调 整 图 像 的 亮度 和 对 比 度 ， 效 末 如 图 9-9 所 示 。 


J34 sm 
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新 媒体 美工 Yuma > 
 —ssi 完全 操作 手册 


图 9-6 调整 亮度 的 效果 图 9-7 调整 自然 饱和 度 效 果 
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图 9-8 设置 “亮度 /对 比 度 ” 参 数 图 9-9 图像 效果 


9 专家 指点 


亮度 1/ 对比度 ”命令 是 调整 像素 的 瞳 度 与 明亮 度 ， 亮 度 就 是 画面 中 的 灯光 ， 亮 度 越 
低 和 画面 越 瞳 ， 有 反之 则 越 亮 ; 对 比 度 表示 和 画面 的 明 瞳 关系 ,对 比 度 越 高 画面 中 的 明 瞳 关系 


选择 “ 滤 镜 ”|“ 演 染 ”|“ 镜 头 光量 ”命令 ,弹出 “镜头 光量 ”对 话 框 , 设置 “ 亮 
度 ” 为 61%、“ 镜 头 类 型 ”为 “50 — 300 毫米 变焦 ”， 如 图 9-10 所 示 。 
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适当 调整 光 军 位 置 ， 单 击 “ 确 定 ” 按 钮 ， 即 可 为 图 像 添 加 “镜头 光学 ” 滤 镜 效 
I. 如 图 9-11 所 示 。 


| 


图 9-10 设置 “镜头 光量 ” 参 妆 图 9-11 “添加 滤 镜 效果 


S 3 Fa 


微 博 平 台 相 对 于 其 他 新 媒体 平台 来 说 ， 可 设计 的 空间 较 少 ， 所 以 更 应 该 好 好 利用 仅 
有 的 几 个 小 空间 ， 最 大 程度 地 展示 产品 的 优势 与 特点， 让 用 户 可 以 更 快 更 好 地 了 解 微 博 
账号 的 主要 内 容 和 主 营 业务 。 


在 “图 层 ” 面 板 中 ， 选 择 “ 图 层 2” 图 层 中 的 图 像 ， 如 图 9-12 所 示 。 
r 12| 运用 移动 工具 将 其 拖 电 至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 大 小 和 位 置 ， 


效果 如 图 9-13 所 示 。 


FEE 。 历 员 记 录 。 动作 


£ 
e l x 


D2m vv- EBE Q THI D 
正常 v| 不 透明 度 : 100% V 
锁定 : Ed Z 小 TPE @ 填充 : 100% v 


| a ” 4 

| Oe U, ia Ü 

ms -一 = PP | 
i 


59 fx 3 Q m mQ W 


图 9-12 选择 “图 层 2” 图 层 图 9-13 调整 后 的 图 像 
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专家 指点 


滤 镜 主要 是 实现 一 种 图 像 特 殊 处 理 的 工具 ， 它 在 Photoshop 中 具有 非常 神奇 的 作用 。 
滤 镜 虽然 看 起 来 操作 简单 ， 但 是 要 与 图 层 等 东西 结合 使 用 ， 才 能 得 到 很 好 的 艺术 效果 ， 
在 最 过 当 的 时 候 将 滤 镜 运用 到 最 合 和 过 的 地 方才 能 体现 滤 镜 的 神奇 之 处 ， 滤 镜 可 分 为 很 多 
种 ， 如 杂 色 滤 镜 、 风 格 化 滤 镜 、 液 化 滤 镜 、 模 糊 滤 镜 等 。 我 们 还 可 以 在 网 络 上 下 载 其 他 
滤 镜 插件， 结合 Photoshop 一 起 使 用 。 


9.1.2 ”制作 微 博 主 图 文字 效果 JU 


下 面 介 绍 制作 微 博 主 图 文字 效果 的 方法 。 

选取 工具 箱 中 的 横 排 文 字 工 具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
细 黑 一 简体 ”、“ 字 体 大 小 ”为 8 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 100、“ 行 距 ” 为 10 点 、 
“颜色 ”为 灰色 (RGB 参数 值 分 别 为 68、69、71)， 激 活 仿 粗 体 图 标 ， 如 图 9-14 所 示 。 
在 图 像 编辑 窗口 中 输入 相应 文字 ， 如 图 9-15 所 示 。 


x 
字 付 PFE JE Vas = 
— = — 
Ta s v 12 105 v| 冰川 套装 
VA 0 v 100 V x 
P. 0% v x 输入 
| Bn | 
| | 
ITT 100% X. || 
ms | 1" 
BEjze z zz r=. s 
图 9-14 设置 字符 属性 9-15 输入 文字 


文学 是 多 数 设 计 作 品 尤 其 是 商业 作品 中 不 可 或 缺 的 重要 元 订 ， 有 时 其 至 在 作品 中 起 
着 主导 作用 ，Photoshop 除了 提供 丰富 的 文字 属性 设计 及 版 式 编排 功能 外 ， 还 允许 对 文字 
的 形状 进行 编辑 ， 以 便 制 作出 更 多 、 更 丰富 的 文字 效果 。 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
雅 黑 ”、“ 字 体 大 小 ”为 9 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 100、“ 颜 色 ” 为 检 色 (RGB 
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参数 值 分 别 为 235, 120. 53), 在 图 像 编 辑 窗口 中 输入 文字 ， 如 图 9-16 所 示 。 
选中 “¥” 符 号 ， 在 “字符 ”面板 中 激活 上 标 图 标 ， 如 图 9-17 所 示 。 


字符 ”段落 库 调整 = 

1 LEMO mam ~ Rena |~| 

h 冰川 套装 Tos v | t (BJ) “| 

2 ViAlo IVA | 

¥148.00 起 x 

| 

| 

x x 输入 | 

a x 
图 9-16 输入 文字 图 9-17 ”激活 上 标 图 标 


编辑 文字 是 指 对 已 经 创建 的 文字 进行 编辑 操作 ， 如 选择 文字 、 移 动 文 字 、 更 改 文字 
排列 方向 、 切 换 点 文字 和 段落 文本 、 拼 写 检 查 文 字 以 及 替换 文字 等 ， 用 户 可 以 根据 实际 
情况 对 文字 对 象 进 行 相 应 操作 。 


选中 “起 ”文字 ， 设 置 “字体 大 小 ”为 5 点 ， 效 果 如 图 9-18 所 示 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
兰亭 超 细 黑 简体 ”、“ 字 体 大 小 ”为 4 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 150、“ 颜 色 ” 
为 黑色 (RGB 参数 值 均 为 0), 激活 仿 粗 体 图 标 ,在 图 像 编 辑 窗口 中 输入 文字 ， 如 图 9-19 所 示 。 
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图 9-18 调整 字体 大 小 效果 图 9-19 输入 文字 
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9.2 微 博 推送 广告 设计 
在 制作 微 博 广告 时 ， 先 打开 并 拖 虹 素 材 图 像 ， 调 整 图像 的 亮度 ， 输 入 相应 的 商品 信息 ， 


最 后 髓 将 图 像 拖 虚 至 微 博 和 界面 中 ， 即 可 完成 设计 。 
本 实例 最 终 效 果 如 图 9-20 所 示 。 
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图 9-20 ”实例 效果 


扫 一 扫 观 看 在 线 视频 , 
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9.2.1 制作 微 博 推送 广告 背景 效果 JU 


下 面 介绍 制作 微 博 推 送 广告 背景 效果 的 方法 。 

选择 “文件 ”| “新建 ” 命令 ， 弹出 “新 建文 档 ” 对 话 框 , 设置“ 名称” 为 “ 微 
博 广 告 设计 ”、“ 宽 度 ” 为 1028 像素 、“ 高 度 ”为 451 像素 、“ 分 辨 率 ”为 72 像素 /英寸 、“ 颜 
色 模式 ”为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”。 单 击 “ 创 建 ” 按 钮 ， 如 图 9-21 所 示 ， 
新 建 一 个 空白 图 像 。 

按 CtrltO 组 合 键 ， 打 开 “ 美 食 背景 jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 
像 拖 电 至 背景 图 像 编 辑 窗口 中 ， 适 当 调整 图 像 的 位 置 ， 效 果 如 图 9-22 所 示 。 
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图 9-22 拖 忠 图 像 


选择 “图 像 | “调整 | “曲线 ”命令 ， 弹 出 “曲线 ”对 话 框 ， 在 曲线 上 单 击 
忌 标 左 键 新 建 一 个 控制 点 ， 设 置 曲线 值 “ 输 入 ”为 40、“ 输 出 ”为 44， 如 图 9-23 所 示 。 
单 击 “确定 ”按钮 ， 调 整 图 像 的 亮度 ， 效 朱 如 图 9-24 所 示 。 
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网 格 坟 小 : 
田 国 自动 内 | 
选项 [TD ) 


显示 : 
回 通过 要 加 (V) 预览 (外 
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图 9-23 ”设置 图 像 属性 图 9-24 调整 亮度 


9.2.2 制作 微 博 推送 广告 文字 效果 


下 面 介绍 制作 微 博 推送 广告 文字 效果 的 方法 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 


粗 倩 简体 ”、“ 字 体 大 小 ”为 91.5 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 100、“ 颜 色 ” 为 黑色 ， 
激活 仿 粗 体 图 标 ， 如 图 9-25 所 示 。 
在 图 像 编辑 窗口 中 输入 文字 ， 如 图 9-26 所 示 。 
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图 9-22 设置 子 竺 面板 图 9-26 输入 文字 


2 Fa 


ë Photoshop F, ë X Kje £ 3: K [| 2 R 2 3F45, 3F36&0F ik e “3 9 7 | “转换 为 
段落 文本 ”或 选择 “类 型 ”|“ 转 换 为 点 文本 ”命令 即 可 。 用 户 可 以 输入 多 个 段落 ， 文 字 
基于 文本 框 的 义 寸 将 自动 换行 ， 也 可 以 进行 段落 调整 ， 文 本 框 的 大 小 可 以 任意 调整 ， 以 
便 重 新 排列 文字 。 


z 303 选取 工具 箱 中 的 矩形 选 框 工具 ， 在 图 像 编 辑 窗 口中 的 适当 位 置 绘制 一 个 矩形 选 
框 ， 如 图 9-27 所 示 。 


单 击 工具 箱底 部 的 前 景色 色 块 ， 弹 出 “ 拾 色 器 (前 景色 )” 对 话 框 ， 设 置 前 景 
色 为 红色 (RGB 参数 值 分 别 为 242、97、68)， 单 击 “ 确 定 ” 按 钮 ， 如 图 9-28 所 示 。 


_ | m web 颜色 


图 9-27 绘制 矩形 选 框 图 9-28 ”设置 前 景 


新 建 图 层 ， 选 择 “ 编 辑 ”|“ 填 充 ” 命 令 ， 弹 出 “填充 ”对 话 框 ， 设 置 “ 内 容 ” 
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为 “前 景色 ”， 如 图 9-29 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 即 可 为 选区 填充 红色 ， 按 CtrltD 组 合 键 取消 选区 ， 效 果 
如 图 9-30 所 示 。 


图 9-29 设置“ 内容” 选项 图 9-30 取消 选区 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 


小 宋体 ”、“ 字 体 大 小 ”为 38 点 、“ 设 置 所 选 字 符 的 字 距 调整 ”为 100、“ 颜 色 ” 为 日 色 (RGB 
参数 值 均 为 255)， 激 活 仿 粗 体 图 标 ， 在 图 像 编 辑 窗 口中 输入 文字 ， 如 图 9-31 所 示 。 

在 “字符 ”面板 中 设置 “字体 系列 ”为 “Adobe E (k Std”、“ 字 体 大 小 ”为 25 点 、 
“设置 所 选 字符 的 字 距 调整 ”为 -25、“ 颜 色 ” 为 红色 (RGB 参数 值 分 别 为 124、25、25)， 
激活 仿 粗 体 与 下 划 线 图 标 ， 如 图 9-32 所 示 。 
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图 9-31 输入 文字 图 9-32 设置 各 选项 


在 图 像 编 辑 窗 口中 输入 文字 ， 适 当 调 整 其 位 置 ， 如 图 9-33 所 示 。 

在 “字符 ”面板 中 设置 “字体 系列 ”为 “Adobe 黑体 Std”、“ 字 体 大 小 ”为 41 点 、 
“颜色 ”为 白色 (RGB 参数 值 均 为 255)， 在 图 像 编辑 窗口 中 输入 文字 ， 适 当 调 整 其 位 置 ， 效 

果 如 图 9-34 所 示 。 
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图 9-33 输入 文字 图 9-34 输入 文字 
选中 除 “ 背 景 ” 图 屋外 的 所 有 图 屋 ， 按 CtrltG 组 合 键 ， 为 图 层 编 组 ， 


1 ” 图 层 组 ， 如 图 9-35 所 示 。 
按 CtrltO 组 合 键 , 打开 “ 微 博 背 景 jpg 素材 图 像 ， 切 换 至 背景 图 像 编辑 窗口 
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得 到 “组 


效果 如 图 9-30 所 示 。 
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除了 资讯 平台 外 , 还 有 其 他 内 容 平台 , 如 问答 平台 知 平 , 以 及 提供 关于 书籍、 
电影 、 音 乐 等 作品 信息 的 社区 网 站 豆 准 等 。 本 章 主要 介绍 这 些 新 媒体 平台 的 头 
像 设计 、 主 图 设计 和 广告 设计 技巧 。 


本 章 重点 导航 


知 乎 账号 头像 设计 
O 豆瓣 书店 广告 设计 
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10.1， 知 乎 账号 头像 设计 


问 丛 平台 是 网 络 营销 中 经 党 使 用 的 一 种 平台 类 型 ， 最 具 代 表 性 的 有 百度 知道 和 腾讯 
SOSO， 而 知 乎 作为 问答 平台 中 最 有 知识 社交 性 的 平台 ， 建 议 运营 者 把 知 平 加 入 到 新 媒体 运 
营 中 。 本 实例 设计 的 古 知 乎 平台 上 的 自 媒 体 账号 头像 。 

在 制作 知 乎 LOGO 时 ， 先 运用 渐变 工具 绘制 出 背景 和 标志 主体 ， 运 用 画笔 工具 添加 适当 
光 点 ， 再 添加 环形 素材 与 文字 ， 最 后 放 入 界面 中 ， 即 可 完成 制作 。 

本 实例 最 终 效果 如 图 10-1 所 示 。 


= ë hb p= 


3ps, Bl, ə¿IHBOP3EB 


Q 上 海 | 房地产 
ib 3 赞同 :0 感谢 . 33 收藏 
65 关注 他 的 人 0 他 关注 的 人 


中 ”房产 知识 库 
车 合 地 产 有 限 公 司 


图 10-1 实例 效果 
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LOGO 在 企业 中 扮演 着 一 个 很 重要 的 角色 ， 它 可 以 代表 一 个 企业 的 形象 ，LOGO 的 
T +R £ <, 
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要 与 企业 处 处 相关 联 ， 可 以 设计 成 抽象 性 、 具 象 性 以 及 非 图 案 字 体 性 三 种 。LOGO 
一 般 是 运用 绘图 的 方式 ， 通 过 色彩 搭配 、 文 字 搭 配 玉 带 给 人 视觉 上 的 美感 。 


10.1.1 制作 知 乎 头像 背景 效果 JU 


下 面 介 绍 制 作 知 乎 账号 头像 背景 效果 的 方法 。 

选择 “文件 ”|“ 新 建 ” 命 令 ， 弹 出 “新 建文 档 ” 对 话 框 ,设置 “ 名 称 ” 为 “ 知 
平头 像 设 计 ”、“ 宽 度 ” 为 1000 像素 、“ 高 度 ” 为 750 像素 、“ 分 辨 率 ” 为 300 像素 /英寸 、 
颜色 模式 ”为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “日 色 ”(RGB 参数 值 均 为 255)。 单 击 “ 创 建 ” 
按钮 ， 如 图 10-2 所 示 ， 新 建 一 个 空白 图 像 。 

展开 “图 层 ” 面 板 ， 新 建 “ 图 层 1” 图 层 ， 如 图 10-3 所 示 。 
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图 10-2 新 建 空白 图 像 图 10-3 ”新建 “图 层 1” 图 层 


选取 工具 箱 中 的 渐变 工具 ， 设 置 左右 色 标的 颜色 为 位 置 92% 紫色 (RGB 参数 
值 分 别 为 104、71、137)， 左 边 色 标的 颜色 为 位 置 8% 浅 蓝 色 (RGB 参数 值 分 别 为 120、188、 
241)， 如 图 10-4 所 示 。 

在 渐变 工具 的 工具 属性 栏 中 单 击 “ 径 向 渐变 ”按钮 ， 移 动 鼠标 光标 至 画布 中 心 
的 位 置 ， 单 击 鼠 标 左 键 并 向 左下 方 拖 上 扎 ， 至 合适 位 置 后 释放 鼠标 ， 即 可 填充 渐变 色 ， 效 果 如 
10-5 所 示 。 
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图 10-4 ”设置 色 标 颜色 图 10-5 “填充 渐变 色 
10.1.2 制作 知 乎 头像 主体 效果 J 


下 面 介 绍 制 作 知 乎 头像 主体 效果 的 方法 。 

2 101 选取 椭圆 选 框 工具 ， 按 住 ShiftrAlt 组 合 键 的 同时 ， 在 图 像 编 辑 窗口 中 绘制 一 
个 正 圆 形 选区 ， 效 果 如 图 10-6 所 示 。 

2 02 新 建 “ 图 层 2” 图 层 ， 选 取 工 具 箱 中 的 渐变 工具 为 图 层 填充 白色 (RGB 参数 值 
均 为 255) 至 黄色 (RGB 参数 值 分 别 为 255、240、0) 的 径 向 渐变 色 , 再 按 CtrltD 组 合 键 取消 选区 ， 
效果 如 图 10-7 所 示 。 


图 10-6 绘制 圆 形 选 区 图 10-7 取消 选区 
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展开 “图 层 ” 面 板 ， 选 择 “ 图 层 2” 图 屋 ， 单 击 鼠 标 左 键 并 将 其 拖 卡 至 “图 层 ” 
面板 下 方 的 “创建 新 图 县 ”按钮 上 ， 如 图 10-8 所 示 ， 松 开 鼠 标 左 键 ， 即 可 得 到 “图 层 2 拷贝 ” 
图 层 。 

按 CtrlLHT 组 合 键 ， 调 出 变换 控制 框 ， 按 住 ShifttAlt 组 合 键 的 同时 ， 等 比例 从 
中 心 点 缩小 图 像 ， 如 图 10-9 所 示 。 


AAA 


FEE ”通道 。 路牌 


e i x 
r: j 


Pam ~v m Q TH D 
正常 v 不 透明 度 : 100% v 
氏 定 : 图 Z 中 TS & 填充 :|100% Ç | 中心 缩 小 | 

: " 11 I = = I = | " | 


e | |EE2:im 


s 


。 国 =: 
@ | | 家 S 


oo f O Q mcm Gñ 


10-8 得 到 “图 层 2 拷 贝 ”图 层 10-9 等 比例 从 中 心 点 缩小 图 像 


专家 指点 


如 果 要 同时 处 理 多 个 图 层 中 的 内 容 (如 移动 、 应 用 变化 或 创建 剪贴 得 版 )， 可 以 将 这 
些 图 层 链接 在 一 起 。 选 择 两 个 或 多 个 图 层 ， 然 后 选择 “图 层 |“ 链接 图 层 ” 命 令 或 单 击 
-图 层 面板 底部 的 “链接 图 层 按钮， 可 以 将 选择 的 图 层 链接 起 来 。 如 果 要 取消 链接 ， 
可 以 选择 其 中 一 个 链接 图 层 ， 然 后 单 击 “ 链 接 图 层 ”按钮 ， 即 可 取消 链接 。 

在 编辑 图 像 文件 时 ， 为 了 减少 磁盘 空间 的 利用 ， 对 于 没 必要 分 开 的 图 质 ， 可 以 将 它 
们 合并 ,这 样 有 助 于 减少 图 像 文件 对 磁盘 空间 的 占用 ,同时 也 可 以 提高 系统 的 处 理 速 度 。 


Ez: Enter 键 确 认 变 换 ， 再 设置 “图 层 2 拷贝 ”图 层 的 “混合 模式 ”为 “ 滤 色 ”， 
如 图 10-10 所 示 。 
继续 设置 “图 层 2 拷贝 ”图 层 的 “不 透明 度 ” 为 80%， 效 果 如 图 10-11 所 示 。 
选取 画笔 工具 ， 展 开 “ 画 笔 ” 面 板 ， 选 择 “ 画 笔 笔 僚 形状 ”选项 ， 设 置 “大 小 ” 
为 15 像素 、“ 硬 度 ” 为 0%、“ 间 距 ” 为 230%， 如 图 10-12 所 示 。 
选中 “形状 动态 ” 复 选 框 , 设置 “大 小 拌 动 ”为 75%, 而 其 他 参数 均 设置 为 0%， 
此 时 ， 面 板 下 方 的 预览 框 中 即 可 显示 调整 后 的 画笔 状态 ， 如 图 10-13 所 示 。 
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图 10-10 ”设置 混合 模式 10-11 设置 “不 透明 度 ” 效 果 
mem == ee 
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10-12 设置 各 参数 10-13 显示 调整 后 的 画笔 状态 


“散布 ”的 各 主要 选项 含义 如 下 所 述 。 

@ “散布 /两 轴 ":“ 散 布 " 用 来 设置 画笔 笔迹 的 分 散 程 度 , 该 值 越 高 , 分 散 的 范围 越 广 。 
如 果 匀 选 “ 两 轴 ” 复 选 框 ， 画 笔 笔迹 将 以 中 间 为 基准 ， 向 两 侧 分 散 。 

@ “数量 : 用 来 指定 在 每 个 间距 间隔 应 用 的 画笔 笔迹 数量 。 

e “数量 抖动 /控制 ”: 用 来 指定 画笔 笔迹 数量 如 何 针对 各 种 间距 间隔 而 变化 。 
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选中 “散布 ” 复 选 框 ， 设 置 “散布 ”为 1000%、“ 数 量 ”为 1、“ 数 量 抖动 ” 
为 0%， 此 时 ， 在 面板 下 方 的 预览 框 中 即 可 显示 调整 后 的 画笔 状态 ， 如 图 10-14 所 示 。 y 


新 建 “图 层 3” 图 层 ， 设 置 前 景色 为 白色 ， 在 球体 上 绘制 散布 的 星 点 ， 效 果 如 — 
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图 10-14 显示 调整 后 的 画笔 状态 10-15 绘制 星 点 


按 Ctrl+O 组 合 键 ， 打 开 “ 装 饰 psd” 素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
眼 至 背景 图 像 编辑 窗口 中 ， 适 当 调整 图 像 的 位 置 ， 效 果 如 图 10-16 所 示 。 

设置 前 景色 为 白色 , 双击 “图 层 4” 图 层 , 弹出 “ 拾 色 器 ”对 话 框 , 选中 “光泽 ” 
复 选 框 ， 设 置 “ 光 泽 颜 色 ” 为 线 橘 色 (RGB 参数 值 分 别 为 255、95、24)， 如 图 10-17 所 示 。 


| 只 有 Web 颜色 


图 10-16 JEE] 10-17 设置 RGB 参数 
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专家 指点 ) 


通过 复制 与 粘贴 图 层 样式 ， 可 以 减少 重复 操作 。 在 操作 时 ， 首 先 选择 包含 要 复制 的 
图 层 样式 的 源 图 层 ， 在 该 图 层 的 图 层 名 称 上 单 击 鼠 标 右键 ， 在 弹出 的 快捷 菜单 中 选择 “ 找 
贝 图 层 样 式 选项 。 


选择 要 粘贴 图 层 样式 的 目标 图 层 ， 它 可 以 是 单个 图 层 也 可 以 是 多 个 图 层 ， 在 图 层 名 称 上 
单 击 鼠 标 右键 ， 在 弹出 的 来 单列 表 框 中 选择 “粘贴 图 层 样式 ”选项 即 可 。 当 用 户 只 需要 复制 
原 图 像 中 的 某 个 图 层 样 式 时 ， 可 以 在 “图 层 ” 面 板 中 按 住 Alt 键 的 同时 ， 单 击 鼠 标 左 键 并 拖 
归 这 个 图 层 样式 至 目标 图 层 中 即 可 。 
设置 “不 透明 度 2 50%. “角度 为 90 度 、 “距离 为 17 人 像素、 大 小 
为 40 像素 ， 点 击 等 高 线 预览 图 右 侧 的 下 拉 按 钮 ， 在 展开 的 下 拉 列 表 框 中 选择 “环形 - 双 ” 样 
式 ， 如 图 10-18 所 示 。 

设置 完毕 后 单 击 “ 确 定 ” 按 钮 ， 即 可 为 图 像 添 加 “光泽 ”图 层 样 式 ， 效 果 如 
图 10-19 所 示 。 


10-18 设置 各 选项 图 10-19 添加 “光泽 ”图 层 样式 


选中 “图 层 4” 图 层 , 单 击 鼠标 右键 , 在 弹出 的 快捷 菜单 中 选择 “拷贝 图 层 样式 ” 
选项 ， 并 粘贴 在 “图 层 4 拷贝 ”图 层 上 ， 效 果 如 图 10-20 所 示 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
准 圆 简 体 ”、“ 字 体 大 小 ”为 11 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 50、“ 颜 色 ” 为 黑色 (RGB 
参数 值 均 为 0)， 如 图 10-21 所 示 。 

在 图 像 编辑 窗口 中 输入 文字 ， 并 移 至 适当 位 置 ， 如 图 10-22 所 示 。 

双击 文字 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “投影 ” 复 选 框 ， 设 置 “投影 
颜色 ”为 紫色 (RGB 参数 值 分 别 为 95、55、228)、“ 不 透明 度 ” 为 22%、“ 角 度 ” 为 143、“ 距 
离 ”为 4 像素 “扩展 ”为 20%、“ 大 小 ”为 3 像素 , 单 击 “确定 ”按钮 ， 即 可 为 文字 添加 “ 投 
影 ”图 层 样式 ， 效 果 如 图 10-23 所 示 。 
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图 10-20 ”粘贴 图 层 样 式 图 10-21 设置 各 选项 


10-22 输入 文字 10-23 添加 “投影 ”图 层 样式 效果 


隐藏 图 层 样 式 可 以 执行 以 下 3 种 操作 方法 。 

° 在 “图 层 ” 面 板 中 单 击 图 层 样式 名 称 “切换 所 有 图 层 效果 可 见 性 ”图 标 ， 可 将 显 
示 的 图 层 样式 隐藏 。 

° 在 任意 一 个 图 层 样式 名 称 上 单 击 和 鼠标 右键 ， 在 弹出 的 菜单 列表 中 选择 “隐藏 所 有 
效果 ”选项 即 可 隐藏 当前 图 层 样 式 效 有 果 ， 

° 在 “图 层 ” 面 板 中 单 击 所 有 图 层 样式 上 方 “ 效 果 ” 左 侧 的 眼睛 图 标 ， 即 可 隐藏 所 


有 图 层 样式 效果 。 
选取 工具 箱 中 的 横 排 文字 工具 ,设置 “字体 系列 ”为 “方正 黑体 简体 ”、“ 字 


体 大 小 ”为 9 点 、“ 设 置 所 选 字符 的 字 距 调整 为 30、 “颜色 ”为 起 色 (RGB 参数 值 均 为 0), 


激活 仿 粗 体 图 标 ， 在 图 像 编辑 窗口 中 输入 相应 文本 ， 如 图 10-24 所 示 。 


新 媒体 美工 YF ma = a > DP 
— 完全 操作 手册 


双击 文字 图 层 , 弹出 “图 层 样式 ” 对 话 框 , 选中 “投影 " 复 选 框 , 设置 “不 透明 度 ” 
为 22%6、“ 距 离 ”为 4 像素 、“ 扩 展 ”为 20%6、“ 大 小 ”为 3 像素 、 “角度 ”为 143， 单 击 “ 确 
定 ”按钮 ， 即 可 为 文字 添加 “投影 ”图 层 样式 ， 如 图 10-25 所 示 。 


图 10-24 输入 文字 图 10-25 添加 “投影 ”图 层 样式 


10.2 豆 辩 书店 广告 设计 


在 制作 豆瓣 平台 的 书店 页 面 广告 时 ， 先 打开 并 拖 虹 素材 图 像 ， 调 整 图像 的 亮度 ， 输 入 相 
应 的 商品 文字 信息 ， 即 可 完成 设计 。 
本 实例 最 终 效果 如 图 10-26 所 示 。 


J3—3J3 观看 在 线 视频 . 
豆 办 书店 广告 设计 


10-26 ”实例 效果 


媒体 平台 
CN 账号 头像 与 页 面 广告 设计 


10.2.1 制作 豆 准 书店 主体 效果 I 


下 面 介 绍 制作 豆 准 书店 页 面 广告 主体 效果 的 方法 。 

按 Ctrlt+O 组 合 键 打开 一 幅 素材 图 像 ， 效 果 如 图 10-27 所 示 。 

选 树 “ 滤 镜 ”|“ 模 糊 ”|“ 高 斯 模糊 ”命令 , 弹出 “高 斯 模糊 ”对 话 框 , 设置 “ 半 
径 ” 为 1 像素 ， 如 图 10-28 所 示 。 


预览 (p) 


图 10-27 打开 素材 图 像 10-28 设置 “高 斯 模糊 ”选项 


单 击 “ 确 定 ” 按 钮 ， 即 可 模糊 图 像 ， 效 果 如 图 10-29 所 示 。 
新 建 “ 亮 度 /对比 度 ” 调 整 图 层 ， 在 “属性 ”面板 中 设置 “亮度 ”为 10、“ 对 
比 度 ”为 10， 调整 背景 图 像 的 亮度 和 对 比 度 ， 效 果 如 图 10-30 所 示 。 
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图 10-29 ”模糊 图 像 10-30 ”调整 图 像 品 度 和 对 比 度 


应 用 “模糊 滤 镜 ,可 以 使 图 像 中 清晰 或 对 比 度 较 强 烈 的 区 域 产 生 模 糊 的 效果 ， 
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打开 “图 书 . psd” 素材 图 像 ， 运 用 移动 工具 将 其 拖 殷 至 当前 图 像 编 辑 窗口 中 的 
合适 位 置 ， 效 果 如 图 10-31 所 示 。 

双击 “图 层 1” 图 层 ， 弹 出 “图 层 样 式 ” 对 话 框 ,选中 “投影 ” 复 选 框 ， 参 数 
设置 如 图 10-32 所 示 。 
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图 10-31 添加 图 书 素材 图 10-32 设置 “投影 ”参数 
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在 Photoshop 中 ,应 用 投影 图 层 样式 ， 可 为 图 层 中 的 对 象 下 万 制造 一 种 阴影 效果 ， 
阴影 的 不 透明 度 “角度 “距离 扩展 大 小 以 及 “等 高 线 等 , AKP Le 图 
层 样 式 对话 框 中 进行 设置 。 

例如 ,在 “图 层 样 式 对 话 框 中 ， 设 置 光 照 角度 ， 可 以 确定 投下 阴影 的 方向 与 角度 ; 
当选 中 后 面 的 使 用 全 局 光复 选 框 时 ， 可 以 将 所 有 图 层 对 象 的 阴影 角度 部 统一 ; 设置 

等 高 线 选项 ,可 以 调整 阴影 的 明暗 部 分 ， 单 击 右 侧 的 下 拉 按 钮 ， 可 以 选择 预 设 效 果 ， 
也 可 以 单 击 预 设 效 有 果 ， 弹 出 “等 高 线 编辑 器 ”对 话 框 重新 进行 编辑 。 


7| 单 击 “确定 ”按钮 ， 应 用 “投影 ”图 层 样式 ， 效 果 如 图 10-33 所 示 。 

08| 选取 工具 箱 中 的 椭圆 选 框 工具 , 在 右 下 角 创建 一 个 椭圆 选区 , 适当 调整 其 位 置 ， 
Py 10-34 四 
新 建 “ 图 层 2” 图 层 ， 为 选区 填充 白色 ， 并 取消 选区 ， 如 图 10-35 所 示 。 
设置 “图 层 2” 图 层 的 “不 透明 度 ” 为 80%， 调 整 图 像 的 不 透明 度 ， 效 果 如 
图 10-36 所 示 。 
为 “图 层 2” 图 层 添加 一 个 图 层 蒙 版 ， 运 用 渐变 工具 从 上 至 下 填充 黑色 至 白色 
的 “线性 渐变 ” 色 ， 效 果 如 图 10-37 所 示 。 
双击 “图 层 2” 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “外 发 光 ” 复 选 框 ， 参 
数 设 置 如 图 10-38 所 示 。 
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10-33 应 用 “投影 ”图 层 样式 色 10-34 ”创建 椭圆 选区 
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10-35 填充 白色 图 10-36 调整 图 像 的 不 透明 度 
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10-37 图像 效果 10-38 设置 “外 发 光 ” 参 数 
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单 击 “ 确 定 ”按钮 ， 应 用 “外 发 光 ” 图 层 样式 ， 效 果 如 图 10-39 所 示 。 
按 CultO 组 合 键 ， 打开“ 宣传 文字 .psd” 素 材 图 像 ， 运 用 移动 工具 将 图 层 组 
的 图 像 拖 忠 至 当前 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 10-40 所 示 。 
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图 10-39 应 用 “外 发 光 ” 图 层 样式 图 10-40 调整 图 像 位 置 


10.2.2 ”制作 豆 办 书店 文字 效果 


下 面 介 绍 制作 豆瓣 书店 页 面 广告 文字 效 末 的 方法 。 
选取 工具 箱 中 的 直 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “迷你 
人 简 启 体 ”、“ 字 体 大 小 ”为 18.5 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 400、“ 颜 色 ” 为 白色 ， 
油 话 仿 粗 体 图 标 ， 如 图 10-41 所 示 。 

在 图 像 编辑 窗口 中 输入 相应 文字 ， 如 图 10-42 所 示 。 
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图 10-42 输入 文字 
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双击 文字 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选中 “ 描 边 ” 复 选 框 ,设置 “颜色 ” 
为 黑色 (RGB 参数 值 均 为 0)， 其 他 参数 设置 如 图 10-43 所 示 。 

单 击 “ 确 定 ” 按 钮 ， 应 用 “ 描 边 ”图 层 样 式 ， 效 果 如 图 10-44 所 示 。 

选取 工具 箱 中 的 圆 角 矩形 工具 ， 在 工具 属性 栏 中 选择 工具 模式 为 “形状 ”， 设 
置 “ 半 径 ”为 15 像素 、“ 填 充 ” 为 红色 (RGB 参数 值 分 别 为 230、0、18)， 绘 制 一 个 圆 角 秆 
形 图 形 ， 如 图 10-45 所 示 。 
选取 工具 箱 中 的 矩形 工具 , 在 工具 属性 栏 中 选择 工具 模式 为 “形状 ”, 设置 “ 填 
充 ” 为 红色 (RGB 参数 值 分 别 为 230、0、18)， 绘 制 一 个 矩形 图 形 ， 如 图 10-46 所 示 。 
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图 10-44 应 用 “ 描 边 ” 图 层 样式 
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图 10-45 #¿#])—“FEl882EJEOIA 图 10-46 ”绘制 矩形 形状 


复制 该 矩形 图 像 ， 并 适当 调整 其 位 置 ， 效 果 如 图 10-47 所 示 。 
选取 工具 箱 中 的 直 排 文字 工具 输入 相应 文字 ， 在 “字符 ”面板 中 设置 “字体 系 
列 ” 为 “Adobe 黑体 Std”、“ 字 体 大 小 ”为 7 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 00、“ 颜 
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色 ” 为 日 色 ， 并 激活 仿 粗 体 图 标 ， 效 末 如 图 10-48 所 示 。 
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图 10-47 ”复制 矩形 形状 10-48 输入 文字 


09| 选取 工具 箱 中 的 直线 工具 , 在 工具 属性 栏 中 选择 工具 模式 为 “形状 ”, 设置 “ 填 
充 ” 为 壮 色 、“ 粗 细 ”为 3 像素 ,绘制 一 个 直线 图 形 ， 效 有 果 如 图 10-49 所 示 。 

10| 选取 工具 箱 中 的 直 排 文字 工具 输入 相应 文字 ， 在 “字符 ”面板 中 设置 “字体 系 
列 为 w 团体 Std”、“ 字 体 大 小 ”为 7.5 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 100、 “PJ 
色 ” 为 黑色 ， 效 果 如 图 10-50 所 示 。 


— = "1" ' 
和 的 


图 10-49 ”绘制 直线 图 形 10-50 输入 文字 


双击 文字 图 层 ， 弹 出 “图 层 样 式 ” 对 话 框 ， 选 中“ 投影” 复 选 框 ， 其 他 参数 设 
É. É 10-51 所 示 。 

单 击 “确定 ”按钮 ， 应 用 “投影 ”图 层 梓 式 ， 效 琳 如 图 10-52 所 示 。 

选取 工具 箱 中 的 直 排 文字 工具 输入 相应 文字 ， 在 “字符 ”面板 中 设置 “字体 系 
列 ” 为 Acumin Variabl.、“ 字 体 大 小 ”为 3.77 点 、“ 颜 色 ” 为 味 色 ， 并 激活 仿 粗 体 图 标 ， 效 
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果 如 图 10-53 所 示 。 


双击 文字 图 层 ， 弹 出 “图 层 样 式 ” 对 话 框 ， 选 中 “投影 ” 复 选 框 ， 设 置 “距离 - 


为 1 像素 、 大 小 为 1 像素 Sah 确定 按钮 ， 效 未 如 图 10-54 所 示 。 
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图 10-53 ”输入 文字 
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10-54 添加 “投影 ”图 层 样式 
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O 零食 品牌 推广 活动 设计 
Ó 珠宝 产品 促销 广告 设计 
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11.1 零食 品牌 推广 活动 设计 


QQ 空间 是 腾讯 为 客户 提供 的 商品 营销 平台 ， 下 面 选 取 其 地 食 推广 页 活动 、 拼 多 多 产品 
推广 页 设计 等 两 个 广告 位 来 作 和 案例 分 析 。 

在 制作 零食 推广 页 时 ， 采 用 深 检 色 的 纯色 背景 ,添加 一 张 推广 产品 的 图 片 ， 再 配 上 简洁 
明了 的 文字 与 图 形 ， 可 以 很 好 地 将 信息 传 递 给 用 户 。 

本 实例 最 终 效 果 如 图 11-1 所 示 。 
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图 11-1 ”实例 效果 
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U - x L ° 零食 品牌 推广 活动 设计 
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如 果 对 绘制 的 圆 角 和 矩形 不 满意 ， 可 以 选择 “窗口 |“ 属 性” 命令， 在 展开 的 “ 属 
性 面板 中 ， 对 圆 角 纸 形 进行 参数 设置 ， 如 填充 “ 描 边 ” “ 描 边 宽度 “半径 等 
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11.1.1 制作 零食 推广 页 主体 效果 DD J 


下 面 详细 介绍 制作 零食 推广 页 主体 效果 的 方法 。 

选择 “文件 ”|“ 新 建 ” 命 令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设置 “名 称 ” 为 “ 零 
食品 牌 推广 活动 设计 ”、“ 宽 度 ” 为 990 像素 、“ 高 度 ” 为 300 像素 、“ 分 辨 率 ” 为 300 像 
素 / 英寸、“ 颜 色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”。 单 击 “ 创 建 ” 按 钮 ， 
新 建 一 个 空白 图 像 ， 如 图 11-2 所 示 。 
4:02 选取 工具 箱 中 的 圆 角 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 这 栖 色 (RGB 
参数 值 分 别 为 243、152、0)、“ 描 边 ” 为 棕色 (RGB 参数 值 分 别 为 168、66、0)、“ 描 边 宽 度 ” 
为 1 像素、“ 半 径 ” 为 10 像素 ， 沿 画布 边缘 绘制 一 个 圆 角 息 形 ， 如 图 11-3 所 示 。 
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(Ú WHH8üIBES0IN 已 保存 EH 打印 国 稿 和 插图 Web ayasa B: Ta 


等 最 这 侦 用 的 项 目 20 


图 11-2 新 建 空白 图 像 图 11-3 绘制 圆 角 和 矩形 


选择 “文件 |“ 打开 ”命令 ,打开 “美食 jpg” 素 材 图 像 ， 如 图 11-4 所 示 。 
选择 “图像 | 调整 | “自然 饱和 度 ” 命令 , 弹出 “自然 饱和 度 ” 对 话 框 , 设置 “ 自 
然 包 和 度 ”为 100、 “饱和 度 为 14， 单 击 “ 确 定 ”按钮 ， 效 霖 如 图 11-5 所 示 。 


图 11-4 素材 图 像 图 11-5 调整 后 的 图 像 效 果 


选择 “图 像 ”|“ 调 整 ”|“ 亮 度 / 对比度 ”命令 ， 弹 出 “亮度 / 对比度” 对话 框 ， 
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设置 “对 比 度 ”为 33$， 单 击 “ 确 定 ” 按 钮 ， 效 果 如 图 11-6 所 示 。 
z: 3 06| 运用 移动 工具 将 素材 图 像 拖 电 至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 大 小 和 
位 置 ， 如 图 11-7 所 示 。 


11-6 调整 后 的 图 像 效 果 图 11-7 Rar EZ 


2 307 运用 椭圆 选 框 工具 绘制 一 个 正 圆 形 选区 ， 按 ShiftrCtrl+I 组 合 键 ， 反 选 选区 ， 
如 图 11-8 所 示 。 

按 Delete 键 删除 选区 内 的 图 像 ， 按 CtrltD 组 合 键 ， 取 消 选 区 ， 并 适当 调整 图 
片 的 位 置 ， 效 朱 如 图 11-9 所 示 。 
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Da 取消 选区 
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图 11-8 反选 选区 图 11-9 取消 选区 


11.1.2 ”制作 零食 推广 页 文字 效果 | 
下 面 介 绍 零食 推广 页 文字 效果 的 方法 。 
选取 工具 箱 中 的 横 排 文字 工具 , 选择 “窗口 ”| 字符 ”命令 , 弹出 “字符 ”面板 ， 
设置 “字体 系列 ”为 “ 华 康 娃娃 体 ”、“ 字 体 大 小 ”为 16.5 点 、“ 颜 色 ” 为 白色 (RGB 参数 
值 均 为 255)， 激 活 仿 粗 体 图 标 ， 如 图 11-10 所 示 。 

在 图 像 编辑 窗口 中 输入 文字 ， 运 用 移动 工具 将 文字 移动 至 合适 位 置 ， 效 果 如 
图 11-11 所 示 。 

选择 “图 层 ”|“ 图 层 样式 ”|“ 投 影 ”命令 , 弹出 “图 层 样 式 ” 对 话 框 ， 设 置 “不 
透明 度 为 73%、 角度 为 90 度 、 距离 为 5 像素 、 扩展” 为 10%、 大 小 为 7 像素 ， 
如 图 11-12 所 示 。 
单 击 “确定 ”按钮 ， 即 可 为 文字 添加 “投影 ”图 层 样式 ， 效果 如 图 11-13 所 示 。 
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> 和 入 局 美味 私房 从 零 信 


11-10 设置 各 选项 11-11 输入 文字 


T 人 
mmuk( 名。 E 加 使 用 全 风光 [6) 加 ur 


PJ 
£ £ £, 2 Q E @ 


添加 样式 


11-12 设置 各 参数 图 11-13 ”添加 图 层 样式 


05| 选取 工具 箱 中 的 直线 工具 , 在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “形状 ”、 
pr ee 参数 值 均 为 255)、“ 粗 细 ” 为 2 像素 ,绘制 直线 图 形 ， 如 图 11-14 所 示 。 
06| 选取 工具 箱 中 的 横 排 文字 工具 ,设置 “ 字 体系 列 ” 为 “方正 卡通 简体 ”、“ 字 
体 大 小 ” pt 点 、“ 设 置 所 选 字 符 的 字 距 调整 ”为 -25、“ 颜 色 ” 为 日 色 (RGB 参数 值 均 为 
255)， 在 图 像 编 辑 窗口 中 输入 文字 ， 如 图 11-15 所 示 。 


美味 私房 从 零食 了 美味 私房 0 零食 


(BE sa s 


图 11-14 绘制 直线 人 -15， 输 六 支 字 


选取 工具 箱 中 的 多 边 形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 黄色 RGB 参 
数值 分 别 为 234、209、73)、“ 描 边 ” 为 无 ， 选 中 “ 星 形 ” 复 选 框 ， 设 置 “ 缩 进 边 依据 ”为 
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ka “ 边 a “HZH” 为 1 像素 ， 如 图 11-16 所 示 。 
08| 按 住 Shift 键 的 同时 , 在 图 像 编 辑 窗口 中 单 击 鼠标 左 键 并 拖 电 , 绘制 一 个 星 形 ， 
如 图 11-17 所 示 。 
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图 11-16 ”设置 各 选项 图 11-17 绘制 一 个 星 形 


多 边 形 工具 的 各 主要 选项 含义 如 下 。 

@ 半径 : 可 以 设置 多 边 形 或 者 星 形 的 半径 长 度 ， 绘 制 时 可 以 创建 指定 半径 值 的 多 边 
形 或 星 形 。 

@ 平滑 扬 角 : 创建 具有 平滑 杨 角 的 多 边 形 或 者 星 形 。 

e ZJ: 选中 该 复 选 框 可 以 创建 星 形 ， 在 “ 缩 进 边 依 据 ”选项 中 可 以 设置 星 形 边缘 
向 中 心 缩 进 的 数量 ， 该 值 越 高 ， 缩 进 量 越 大 ; 若 选 中 平滑 缩 进 复 选 框 ， 可 以 
使 星 形 的 边 平 滑 地 向 中 心 缩 进 。 


2 09 选取 工具 箱 中 的 直接 选择 工具 ， 适 当 调整 星 形 两 个 角 的 长 度 ， 效 果 如 图 11-18 
所 示 。 

10| 选取 工具 箱 中 的 移动 工具 ， 按 Ctrl+T 组 合 键 ， 调 出 变换 控制 框 ， 在 工具 属性 
pika xe 为 25 度 ， 此 时 图 像 编 辑 窗口 中 的 图 像 也 随 之 旋转 ， 如 图 11-19 所 示 。 
按 Enter 键 确认 变换 ， 并 将 图 像 移 至 合适 位 置 ， 效 果 如 图 11-20 所 示 。 
12| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
、“ 字 体 大 小 ”为 6 点 、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 235)， 在 图 像 编 辑 窗 
口中 输入 文字 ， 如 图 11-21 所 示 。 
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移动 工具 是 Photoshop 软件 工具 栏 中 使 用 最 多 的 工具 ， 主 要 是 负责 移动 图 层 和 图 像 等 
方便 复制 操作 。 在 选择 移动 工具 后 ，Photoshop 会 弹出 移动 工具 面板 (又 称 为 移动 工具 选 
项 栏 )， 可 供 使 用 者 对 移动 工具 的 功能 进行 细微 设置 与 调节 。 
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要 13| 按 Ctrl+O 组 合 键 ， 打 开 “ 按 钮 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
眼 至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 11-22 所 示 。 

EEU44] 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
准 圆 体 ”、“ 字 体 大 小 ”为 8.8 点 、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 255)， 在 图 像 编辑 窗 
口中 输入 文字 ， 如 图 11-23 所 示 。 


移动 | i 输入 x 
w 


EZ15 选中 除 “背景 ”图 层 外 的 所 有 图 层 ， 按 Ctrl+G 组 合 键 ， 为 图 层 编组 ， 得 到 “组 
图 层 组 ， 如 图 11-24 所 未 AD 
22316 按 Ctrl+O 组 合 键 ， 打 开 “QQ 空间 jpg” 素 材 图 像 ， 运 用 移动 工具 将 图 层 组 的 
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图 像 拖 卡 至 刚 打 开 的 图 像 编 辑 窗 口中 ， 适 当 调 整 图 像 的 位 置 和 大 小 ， 效 末 如 图 11-25 所 示 。 
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图 11-24 得 到 “组 1” 图 层 组 图 11-25 调整 后 的 图 像 效 果 


E a )) 


W x B] £ 6) ERA BR ë, = 22 142 P a Pñ 6, t 28 95 0) W oR PR 6, £ W = J& E Zt 48 SE 2 ub 
区 ， 然 后 删除 选区 ， 可 以 看 见 被 删除 的 部 分 变 成 了 透明 区 域 ， 普 通 图 层 更 有 利于 图 像 的 
编辑 ， 如 果 没 有 特殊 要 求 ， 一 般 编 辑 图 片 时 可 以 把 背景 层 转 换 为 普通 层 。 

普通 图 层 是 Photoshop 中 最 基本 的 图 层 ， 也 是 最 第 用 的 图 层 之 一 ， 在 创建 和 编辑 图 像 
时 ,创建 的 图 技 者 是 首 通 图 层 ， 在 首 通 图 后 上 可 以 设置 图 层 混 合 模式 、 调 凶 不 远 明 度 和 
填充 ， 从 而 改变 图 层 的 显示 效果 。 单 击 “ 图 层 ” 面板 底部 的 “创建 新 图 层 ” 按 钮 图 ， 即 
可 创建 首 通 图 层 。 在 Photoshop 中 ,展开 “图 层 面板 ， 移 动 鼠 标 至 “图 层 1 BH, 
单 击 鼠 标 左 键 并 抱 避 至 面板 右 下 方 的 创建 新 图 技 按钮 图 上 , 即 可 复制 图 后 , 并 生成 图 
层 1 拷贝 ”图 层 。 


1 和 2， 珠宝 产品 促销 广告 设计 


新 品 发 布 活动 的 主要 目的 是 力求 激发 顾客 对 新 产品 、 新 店铺 等 产生 兴趣 ， 从 而 达到 销售 
ee 目的 ， 这 也 是 最 为 常规 的 营销 方式 。 在 制作 QQ 空间 新 产品 推广 活动 页 面 时 ， 通 常 可 
六 结合 各 种 促销 手段 来 增加 活动 的 吸引 力 ， 从 而 快速 获取 优质 用 户 的 关注 。 
本 实例 最 终 效果 如 图 11-26 所 示 。 
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图 11-26 ”实例 效果 


扫 一 扫 观 看 在 线 视频 
珠 宇 产 呈 促销 广告 设计 
11.2.1 制作 产品 页 面 文字 效果 JW 


网 店 的 促销 活动 可 以 让 消费 者 降低 初次 消费 成 本 ， 从 而 更 容易 接受 新 产品 。 下 面 详细 介 
绍 新 品 上 市 促销 活动 的 文字 设计 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 一 幅 素材 图 像 ， 如 图 11-27 所 示 。 

选取 工具 箱 中 的 横 排 文 字 工 具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
雅 黑 ”、“ 字 体 大 小 ”为 147 点 、“ 设 置 消 除 锯齿 的 方法 ”为 “浑厚 ”、“ 颜 色 ” 为 红色 RGB 
参数 值 分 别 为 255、12、12)， 如 图 11-28 所 示 。 

将 鼠标 移动 至 图 像 编 辑 窗口 中 单 击 鼠 标 左 键 ， 输 入 文字 ， 按 CtrltEnter 组 合 键 
确认 输入 ， 选 取 工具 箱 中 的 移动 工具 ， 将 文字 移动 至 合适 位 置 ， 效 果 如 图 11-29 所 示 。 

选取 工具 箱 中 的 横 排 文 字 工具 ,在 “字符 ”面板 中 设置 “字体 系列 ”为 “黑体 ”、“ 字 
体 大 小 ”为 128 点 、“ 设 置 消 除 锯齿 的 方法 ”为 “浑厚 ”、“ 颜 色 ” 为 白色 ， 如 图 11-30 所 示 。 
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图 11-29 输入 文字 图 11-30 ”设置 “字符 ”属性 


将 鼠标 移动 至 图 像 编 辑 窗口 中 单 击 鼠标 左 键 ， 输 入 文字 ， 按 Ctrl+Enter 组 合 键 
确认 输入 ， 选 取 工 具 箱 中 的 移动 工具 ， 将 文字 调整 至 合适 位 置 ， 效 果 如 图 11-31 所 示 。 

选取 工具 箱 中 的 横 排 文 字 工 具 , 在 “字符 ”面板 中 设置 “字体 系列 ”为 “黑体 ”、“ 字 
体 大 小 ”为 128 点 、“ 设 置 消 除 锯 贞 的 方法 ”为 “浑厚 ”、“ 颜 色 ” 为 白色 ， 如 图 11-32 所 示 。 

ms 07| 将 鼠标 移动 至 图 像 编辑 窗口 中 单 击 鼠 标 左 键 ， 输入 文字 ， 按 Ctl+Enter 组 合 键 
确认 输入 ， 选 取 工 具 箱 中 的 移动 工具 ， 将 文字 调整 至 合适 位 置 ， 效 果 如 图 11-33 所 示 。 

选中 “ 折 起 ”文字 图 层 ， 在 菜单 栏 中 选择 “图 层 ”|“ 图 层 样式 ”|“ 投 影 ”命令 ， 
即 可 弹出 “图 层 样式 ”对 话 框 ， 设 置 “角度 ”为 30 度 、“ 距 离 ” 为 5 像素 、“ 大 小 ”为 5 像 
素 ， 单 击 “ 确 定 ”按钮 ， 即 可 应 用 投影 效果 ， 如 图 11-34 所 示 。 


ee 


— “s 


QQ 空间 : 
K<%& << 好 友 动 态 信 息 流 广 告 设 计 


| ry 
字符 E= 

W .............................. 

| 

| 里 体 k - w 

T1128 点 v rap V | 

| 

Ië v ËO V | 

L: 0% v | 

| 

IT 100% 工 loo% | x 

| Aa 占 。 | 

A — s: J] 

| - 

| | | 


L TTTTT TT T | 


fc 和 人 aa 有 it 1⁄2 


| Xs 


图 11-31 调整 文字 图 11-32 设置 “字符 ”属性 
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图 11-33 ”调整 文字 图 11-34 ”应 用 投影 效果 
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—— yÑ 

01| 按 Ctrl+O 组 合 键 ， 打开“ 新 品 标签 psd” 素 材 图 像 ， 如 图 11-35 所 示 。 

02] 选取 工具 箱 中 的 移动 工具 ， 将 新 品 标签 素材 图 像 拖 电 至 背景 图 像 编辑 窗口 中 ， 
如 图 11. 36 "Ti 


由 于 以 JPEG 格式 存储 文件 时 会 去 失 图 像 数据 ， 因 此 ， 如 果 准 备 对 文件 进行 进一步 编 
辑 或 创建 额外 的 JPEG 版 本 ， 最 好 以 原始 格式 (例如 Photoshop .PSD) 存储 源 文件 。 减 少 
颜色 数量 通常 可 以 减 小 图 像 的 文件 大 小 ， 同 时 保持 图 像 品 质 。 可 以 在 颜色 表 中 添加 和 删 
除 颜 色 ， 将 所 选 颜 色 转 换 为 Web 安全 颜色 ， 并 锁定 所 选 颜 和 色 以 防 其 从 调 板 中 删除 。 
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图 11-35 打开 素材 图 像 11-36 拖 入 素材 


Ez Ctd+T 组 合 键 ， 调 出 变换 控制 框 ， 适 当 调整 其 大 小 和 位 置 ， 按 Enter 键 确认 ， 
效果 如 图 11-37 所 示 。 

新 建 “亮度 /对比度 1” 调整 图 层 , 展开 “属性 ”面板 , 设置 “亮度 ”为 35、“ 对 
比 度 ” 为 20， 如 图 11-38 所 示 。 


e 调整 库 颜色 色 板 = 
多 回 == ike 
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11-37 调整 大 小 和 位 置 11-38 ”设置 参数 值 


选择 “亮度 /对比度 1” 调 整 图 层 ， 创 建 剪贴 莹 版 ， 效 果 如 图 11-39 所 示 。 
在 “图 层 ” 面 板 中 ， 选 择 “背景 ”图 层 ， 按 CalJ 组 合 键 拷贝 图 层 ， 如 
图 11-40 所 示 。 

选择 “ 滤 镜 ”| “ 杂 色 ”| “添加 杂 色 ”命令 , 弹出 “添加 杂 色 ”对 话 框 , 设置 “ 数 
量 为 3%， 如 图 11-41 所 示 。 
单 击 “ 确 定 ”按钮 ， 添 加 “添加 杂 色 ” 滤 镜 效果 ， 如 图 11-42 所 示 。 
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图 11-39 创建 剪贴 蒙 版 图 11-40 ”拷贝 图 层 


预览 (P) 


1⁄2 THE 


图 11-42 ”添加 滤 镜 效果 


sa 


11-41 设置 数量 


专家 指点 》) 


亮度 (Value， 简 写 为 VY， 又 称 为 明度 ) 是 指 颜 色 的 明 瞳 程度 ， 通 常 使 用 从 0%~100% 
的 百分比 来 度量 。 在 正 第 强度 光线 照射 下 的 色相 ， 被 定义 为 标准 色相 ， 亮 度 高 于 标准 色 
相 的 ， 称 为 该 色相 的 高 光 ， 反 之 称 为 该 色相 的 阴影 。 

不 同 亮度 的 颜色 给 人 的 视觉 感受 各 不 相同 ， 高 亮度 颜色 给 人 以 明亮 、 纯 净 、 唯 美 等 
感觉 ， 中 亮度 颜色 给 人 以 朴素 、 稳 重 、 亲 和 的 感觉 。 低 亮度 颜色 则 让 人 感觉 压抑 、 沉 重 、 


神秘 。 
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抖 音 、 快 手 等 短视 频 的 应 用 以 及 各 种 直播 平台 的 出 现 ， 促 成 了 短视 频 和 直 
播 的 爆发 ， 成 就 了 大 批 的 网 红 ， 也 市 来 了 很 多 商业 机 会 。 本 章 主 要 介绍 快手 、 
撑 音 平台 中 的 秽 匈 设计 生 例 ， 以 币 助 目 媒 体 和 网 红 取 得 更 好 的 引流 效果 。 


本 章 重 点 导航 


O 快手 个 人 主页 封面 设计 
Ó 拌 音 平台 个 人 名 片 设计 


(yG % 4G.AlFs Ü 34% 09:01 | 


` PE YE y Tq 
选择 分 享 方式 


图 片 形式 (点 击 预览 ) 链接 形式 
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12.1 快手 个 人 主页 封面 设计 


快手 最 初 是 一 款 用 来 制作 和 分 享 GIF 图 片 的 手机 应 用 ， 如 今 已 经 从 纯粹 的 工具 应 用 转型 
为 短视 频 社 区 ， 成 为 用 户 记 录 和 分 享 生活 的 平台 。 当 然 ， 各 行 各 业 的 新 媒体 达 人 也 利用 这 个 
热门 的 短视 频 平台 ， 分 享 自己 的 特长 和 技能 ， 成 为 自 媒体 引流 利器 

本 实例 主要 介绍 一 个 摄 景 后 期 达 人 的 快手 短视 频 教程 宣传 广告 设计 ， 最 终 效果 如 图 12-1 
所 示 。 
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图 12-1 实例 效果 


扫 一 扫 观 看 在线 视频 . 
快手 个 人 主页 封面 设计 


12.1.1 制作 个 人 主页 封面 主体 效果 | 
emetic 
1| 按 Ctrl+O 组 合 键 ， 打 开 一 幅 素 材 图 像 ， 如 图 12-2 所 示 。 
02 选取 工具 箱 中 的 圆 角 算 形 工具 ， 在 工具 属性 栏 中 选择 工具 模式 为 “形状 ”， 设 
W — ee Hl 为 白色 、“ 描 边 宽度 ”为 5 像素 ， 绘 制 一 
圆 角 和 矩形 图 形 ， 如 图 12-3 所 示 。 
双击 “ 圆 角 和 矩形 1” 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “投影 ” 复 选 框 ， 
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ee 12.4 所 不。 
步骤 届 ZH, JV 效 末 如 图 12-5 所 示 。 


12-2 打开 素材 图 像 12-3 绘制 圆 角 生 形 图 形 


图 居 桂 式 
1Ex& 
2118511 
iptal 


BU ETRE (W)... 
B muu, 


TP (N): ü 8 
Ë 轴 基 皖 空 投 时 人 ul 
We Ph L [8 ED | 
` FL. | 
设置 


图 12-4 设置 “投影 ”选项 图 12-5 ”应 用 “投影 ”图 层 样 式 


尘 “ 圆 角 和 矩形 1” 图 层 ， 将 其 栅 格 化 ， 选取 工 具 箱 中 的 矩形 选 框 工具 ， 在 边 
框 上 方 创 ` wiralla 如 图 12-6 所 示 。 
按 Delete 键 ， 删 除 选 区 内 的 图 像 ， 并 取消 选区 ， 效 果 如 图 12-7 所 示 。 
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126 “IË EJE P< 12-/ 删 陈 选区 内 的 图 像 


Ez Ctrl+oO 组 合 键 ， 打 开 “ 相 机 .jpg” 素 材 图 像 ， 如 图 12-8 所 示 。 
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选取 工具 箱 中 的 魔 棒 工 具 ， 在 工具 属性 栏 中 设置 “ 容 产 ”为 6， 在 日 色 的 背景 
处 单 击 创建 选区 ， 如 图 12-9 所 示 。 


图 12-8 打开 相机 素材 图 像 图 12-9 创建 选区 


选择 “选择 ”|“ 反 选 ” 命 令 ， 反 选 选区 ， 按 Ctrl+J 组 合 键 复制 选区 内 的 图 像 ， 
如 图 12-10 所 示 。 

按 CtltD 组 合 键 取消 选区 , 选择 “ 滤 镜 ”|“ 泻 染 ”| “镜头 光量 ”命令 , 弹出 “ 镜 
头 光 量 ” 对 话 框 ， 设置 “亮度 ”为 75%， 单 击 “ 确 定 ”按钮 ， 效 果 如 图 12-11 所 示 。 


图 12<-10 反选 选区 图 12-11 应 用 滤 括 


223 11| 运用 选择 工具 将 选区 内 的 图 像 拖 忠 至 背景 图 像 编 辑 窗口 中 ， 适 当 调 整 素材 的 大 
小 和 位 置 ， 将 未 如 图 12-12 所 示 。 


图 12-12 拖 入 相机 票 材 
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12.1.2 ”制作 个 人 主页 封面 文字 效果 


下 面 介绍 制作 快手 个 人 主页 封面 文字 效果 的 方法 。 
选取 工具 箱 中 的 矩形 选 框 工具 ,在 图 像 中 创建 一 个 盾 形 选区 ， 如 图 12-13 所 示 。 
选择 “选择 ”|“ 变 换 选 区 ”命令 ， 调 出 变换 控制 框 ， 如 图 12-14 所 示 。 


12-13 创建 矩形 选区 12-14 幸 出 变换 控制 杠 


企 变换 工具 的 工具 属性 管 中 ， 设 首 “ 旋 转 为 45 度 ， 调 整 矩形 选区 的 角度 ， 


效果 如 图 12-15 所 示 。 
将 选区 调整 至 合适 位 置 ， 并 按 Enter 键 确认 变换 操作 ， 效 果 如 图 12-16 所 示 。 


确认 变换 


图 12-15 ”调整 选区 角度 图 12-16 
展开 “图 层 ” 面 板 ， 新 建 “ 图 层 2” 图 层 ， 如 图 12-17 所 示 。 
设置 前 景色 为 白色 (RGB 参数 值 均 为 255)， 如 图 12-18 所 示 。 

为 选区 填充 前 景色 ， 并 取消 选区 ， 效 果 如 图 12-19 所 示 。 

rZ 08 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
雅 黑 ”、“ 字 体 大 小 ”为 12 点 、“ 颜 色 ” 为 黑色 ， 如 图 12-20 所 示 。 

在 图 像 编辑 窗口 中 输入 相应 文字 ， 如 图 12-21 所 示 。 

按 CtrltT 组 合 键 , 调 出 变换 控制 框 , 在 变换 工具 的 工具 属性 栏 中 , 设置 “旋转 ” 
为 45 度 ， 调 整 文字 的 角度 ， 将 文字 调整 至 合适 位 置 ， 并 按 Enter 键 确认 变换 操作 ， 效 果 如 


图 12-22 所 示 。 
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图 12-17 新 建 图 层 


图 12-19 ”填充 前 景色 图 12-20 ”设置 字符 属性 


图 12-21 输入 相应 文字 图 12-22 调整 文字 角度 
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11| 选取 工具 箱 中 的 横 排 文 字 工 具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
2 、“ 字 体 大 小 2368. “颜色 为 日 色 ， 输 入 相应 文字 ， a wa N 12-23 所 示 。 
双击 “构图 大 法 ”文字 图 层 ， 弹出 “图 层 梓 式 ” 对 话 框 ,选中 “投影 ” 复 选 框 


⁄ 
其 他 参数 设置 如 图 12-24 所 示 ，。 | 和 


期 路 李 了 趟 1W] 
B) WW) 


图 12-23 输入 相应 文字 图 12-24 设置 “投影 ”参数 


43 单 击 “ 确 定 ” 按 钮 ， 应 用 “投影 ”图 层 样 式 ， 效 果 如 图 12-25 所 示 。 
7 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
"w ' ne 为 25 点 、“ 颜 色 ” 为 白色 ， 输 入 相应 文字 ， 如 图 12-26 所 示 。 


图 12-23 应 用 “投影 ”图 层 样式 图 12-26 输入 相应 文字 


打开 “文字 1psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 背景 图 像 编 辑 窗 口中 
的 合适 位 置 ， 效 果 如 图 12-27 所 示 。 
打开 “标志 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 忠 至 背景 图 像 编辑 窗口 中 的 


合适 位 和 时， 效 霖 如 图 12-28 所 示 。 
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12.2， 抖 音 平台 个 人 名 片 设计 


拌 音 ， 是 一 款 可 以 拍摄 短视 频 的 音乐 创意 短视 频 社 交 软 件 ， 同 时 还 开通 了 直播 功能 ， 因 
此 成 为 很 多 目 媒体 创业 者 的 内 容 运 营 平 台 。 抖 音 新 媒体 平台 运营 的 重点 是 对 内 提高 粉丝 的 活 
跃 和 留存 度 ， 对 外 则 获得 传播 和 转化 ， 主 要 是 为 了 获得 新 用 户 和 品牌 塑造 。 

本 实例 主要 介绍 一 张 拌 音 个 人 名 片 的 设计 方法 ， 最 终 效 果 如 图 12-29 所 示 。 
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图 12-29 实例 效果 
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12.2.1 制作 个 人 名 片 背 景 效果 

下 面 介绍 制作 拌 音 个 人 名 片 背 景 效果 的 方法 。 

下 到 01| 选择 “文件 ”|“ 新 建 ”命令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设 置 各 项 参数 ， 如 
"is ama 单 击 “创建 按钮 ， 新 建 一 个 空白 图 像 。 
02 新 建 “ 图 层 1” 图 层 ， 设 置 前 景色 为 绿色 (RGB 参数 值 分 别 为 207、220、 


40)， 如 图 12-31 所 示 。 


已 保存 BE 


(Ü 最 后 使 用 项 


图 12-31 设置 前 景 


图 12-30 “新 建文 档 ” 对 话 框 


一 -上 “图 层 1” 图 层 填充 前 景色 ， 如 图 12-32 所 示 。 
04| 选取 工具 箱 中 的 矩形 选 框 工具 ， 创 建 一 个 矩形 选区 ， 如 图 12-33 所 示 。 


图 12-32 填充 前 景 图 12-33 创建 矩形 选区 


05| 选取 工具 箱 中 的 多 边 形 套 索 工 具 ， 在 工具 属性 栏 中 单 击 “ 从 选区 减 去 ” 按 


am, wauu 如 图 12-34 所 示 。 
色 为 深 绿 色 (RGB 参数 值 分 别 为 0、172、 


06| 新 建 “ 图 层 2” 图 层 ， 设 置 前 景 
167)， 为 过 先 区 填充 颜色 ， 取 消 选 区 ， 效 果 如 图 12-35 所 示 。 


TE mm 
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图 12-34 减 去 选区 区 域 12-35 填充 颜色 


站 ) 


选区 具有 灵活 操作 性 ， 可 多 次 对 选区 进行 编辑 操作 ， 以 便 得 到 满意 的 选区 形状 。 


12.2.2 ”制作 个 人 名 片 主 体 效 果 | 


下 面 介 绍 制作 抖 音 个 人 名 片 主 体 效 果 的 方法 。 

打开 “人 物 jpg” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 卡 至 背景 图 像 编辑 窗口 中 的 
合适 位 置 ， 效 果 如 图 12-36 所 示 。 

按 Ctrl+T 组 合 键 调 出 变换 控制 框 ， 适 当 调 整 图 像 的 大 小 和 位 置 ， 并 按 Enter 键 
确认 ， 效 果 如 图 12-37 所 示 。 


图 12-36 ” 拖 忠 人 物 素材 12-37 调整 图 像 


选择 “图 像 ”|“ 调 整 ”|“ 亮 度 / 对比度 ”命令 ,弹出 “亮度 /对比度 ”对 话 框 ， 
设置 “亮度 ”为 6， 单 击 “ 确 定 ”按钮 ， 效 果 如 图 12-38 所 示 。 
打开 “彩带 psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 背景 图 像 编辑 窗口 中 的 
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合适 位 置 ， 效果 如 图 12-39 所 示 。 


12-38 ”隐藏 部 分 图 像 效 果 图 12-39 拖 鼻 彩 审 素材 


05| 将 “图 层 4? 图 层 拖 电 至 “图 层 3” 图 层 的 下 方 ,调整 图 层 顺序 ,效果 如 图 12-40 所 示 。 
06| 选取 工具 箱 中 的 矩形 工具 , 在 工具 属性 栏 中 选择 工具 模式 为 “形状 ”, 设置 “ 填 
充 ” 为 无 “ 描 边 ”为 黑色 、“ 描 边 宽度 ”为 5 像素 ， 绘 制 一 个 矩形 图 形 ， 如 图 12-41 所 示 。 


图 12-40 ”调整 图 层 顺序 图 12-41 绘制 矩形 图 形 


07| 将 “ 算 形 1” 图 层 栅 格 化 , 选取 工具 箱 中 的 橡皮 擦 工具 , 擦 除 右 上 角 的 部 分 边框 ， 
wasu 到 12-42 所 示 。 

08| 选取 工具 箱 中 的 多 边 形 套 索 工具 ， 在 黑色 矩形 右上 和 角 创 建 一 个 多 边 形 选 区 ， 如 
图 a 43 i 

新 建 “ 图 层 3” 图 层 ， 设 置 前 景色 为 绿色 (RGB 参数 值 分 别 为 0、172、167)， 
12-44 

10| 为 选区 填充 前 景色 ,并 取消 选区 ， 效 果 如 图 12-45 所 示 。 

11| 双击 “图 层 5” 图 层 ， 弹 出 "k. 对 话 框 ， 选 中 “投影 ” 复 选 框 ， 其 他 
了 12-46 所 示 。 

单 击 “确定 ”按钮 ， 应 用 “投影 ”图 层 样式 ， 效 果 如 图 12-47 所 示 。 
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图 12-42 ” 探 除 部 分 边框 图 12-43 ”创建 多 边 形 选区 


只 有 web 颜色 


图 12-45 填充 前 景 


RE 二 


图 12-46 设置 “投影 ”参数 图 12-47 ”应 用 “投影 ”图 层 样式 
12.2.3 制作 个 人 名 片 文字 效果 JU 


下 面 介 绍 制 作 抖 音 个 人 名 卢 文 字 歼 朱 的 方法 。 


<<< 快手 封面 村主 二 


打开 “装饰 psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 归 至 背景 图 像 编 辑 窗口 中 的 
合适 位 置 ， e 到 12-48 所 示 。 

02 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
大 黑 简 a. “字体 大 小 ”为 14 点 、“ 设 置 行距 ”为 16 点 、“ 颜 色 ” 为 里 色 ， 如 图 12-49 所 示 。 


EE RN ET Et 


| 方正 大 黑 简体 E V 
HT 14 点 v ík 165 V 


Vo EJ. 


L n s V E S S n s] 


图 12-48 Ren seti s= 1) 图 12-49 设置 字 竺 属性 


在 黑色 边框 内 输入 相应 的 文字 内 容 ， 效 果 如 图 12-50 所 示 。 


将 文字 图 层 栅 格 化 ， 选 取 工具 箱 中 的 矩形 选 框 工 具 ， 在 “ 手 ” 字 上 创建 一 个 先 
区 ， 如 图 12-51 所 示 。 


图 12-50 ”输入 文字 图 12-51 创建 选区 


按 Ctrl+T 组 合 键 调 出 变换 控制 框 ， 适当 调 整 文字 部 分 图 像 的 大 小 ， 效 果 如 
图 12-52 — 

06 按 CtrlD 组 合 键 ， 取 消 选 区 ， 效 果 如 图 12-53 所 示 。 

07| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
滑行 档 * 、 “字体 大 小 ”为 10 点 、“ 颜 色 ” 为 白色 ， 输 入 相应 文字 ， 效 果 如 图 12-54 所 示 。 

选择 “编辑 ”|“ 变 换 ”|“ 和 斜 切 ”命令 ， 调 出 变换 控制 框 ， 适 当 调 整 文字 的 形 
状 并 确认 ， 如 图 12-55 所 示 。 


人 


WERE 


*JT 媒 体 == 3 ü x mam =a -ppp, 


图 12-53 ”取消 选区 


图 12-54 输入 文字 图 12-55 JSE S FAN 


2 309 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
a Poza kanan pte pe gt oth ms 

0| 选择 “编辑 ”|“ 变 换 ”|“ 和 斜 切 ”命令 ， 调 出 变换 控制 框 ， 适 当 调 整 文字 的 形状 ， 
R 12-57 所 示 。 


图 12-56 ”输入 文字 图 12-57 调整 文字 形状 


选取 工具 有 中 的 柄 排 文字 工具 , 在 “了 字 侍 面板 中 设 站 “字体 系列 为 “做 软 
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雅 黑 ”、“ 字 体 大 小 ”为 5 点 、“ 颜 色 ” 为 黑色 ， 输 入 相应 文字 ， 效 果 如 图 12-58 所 示 。 
打开 “文字 2psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 背景 图 像 编辑 窗口 中 
的 合适 位 置 ， 效 朱 如 图 12-59 所 示 。 


图 12-58 输入 文字 图 12-59 ” 拖 忠 文字 素 材 
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知识 导读 


除了 图 文 、 短 视频 和 直播 等 内 容 形 式 外 ， 如 果 你 的 声音 甜美 ， 或 者 喜欢 语 
音 表达 ， 也 可 以 在 音频 新 媒体 平台 上 创建 一 个 自己 的 电台 市 目 ， 用 声音 吸引 粉 
经， 成 为 声优 ， 塑 造 个 人 品牌 。 本 章 主要 介绍 音频 新 媒体 平台 的 界面 设计 。 


本 章 重点 导航 


荔枝 微 课 宣传 页 界面 设计 
喜马拉雅 广播 活动 页 设计 


龙 飞 老师 倾心 打造 深度 好 课 | 
(摄影 与 人 像 》 | 200 种 构图 解密 +200 张 作品 剖析 
13 最 摄影 人 像 专 题 讲 艇 | 手机 摄影 构图 大 全 一 一 轻松 拍 出 大 片 》 


ul. 竹内 š; 
* 第 | 章 人 像 的 构图 
* 第 ?到 空间 迁 视 三 
* 第 3 齐 前 车 的 应 用 
* 第 4 党 诠 可 的 应 用 
* 第 5 章 背景 的 几何 
* 第 6 章 均 图 法 思考 
* 第 7 章 光影 的 位 置 
* 第 3 章 留 白 的 应 用 
* 第 9 齐 色彩 的 搭配 
* 第 10 章 独 头 的 作用 
* 第 ll 章 拼图 的 应 用 


一 样 的 镇 头 ， 称 汶 何 拍 不 出 恢弘 大 月 ? — 
一 样 的 手机 ， 你 为 们 不 能 发 现 隐 匣 之 美 ?| s 
大 片 与 普通 作品 之 间 ， 只 差 着 一 个 构图 枝 法 的 
距离 | 
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———s 完全 操作 手册 
13.1 艺术 微 课 宣传 页 界面 设计 


蓝 校 微 课 征 一 个 大 众 知识 分 享 平 台 ， 能 够 提升 用 户 各 项 技能 素养 。 获 枝 微 课 首 创 PPT 语 
音 同步 直播 ， 老 师 可 以 录制 音频 和 视频 内 容 ， 拥 有 强大 的 流量 支撑 ， 可 以 协助 老师 分 销 课 程 。 


本 实例 主要 古 制作 功 校 微 课 的 课程 页 面 ， 最 终 效 末 如 图 13-1 所 示 。 


[H @ + ND @4G.4AlFh Ü 33% 10:22 


x 荡 枝 微 课 


ake Io 手机 电脑 同步 听课 
ee 手机 电脑 同步 听 ; —w 


龙 飞 老师 倾心 打造 深度 好 课 


《摄影 与 人 像 》 
13 章 摄影 人 像 专题 讲解 


龙 飞 老师 倾心 打造 深度 好 课 


《摄影 与 人 像 》 


图 13-1 实例 效果 


扫 一 扫 观 看 在 线 视 频 . 
茵 村 和 溅 课 宣传 页 设计 


13.1.1 制作 宣传 页 背景 效果 


下 面 介绍 制作 荔枝 微 课 宣传 页 背景 效 末 的 方法 。 


按 Ctrl+O 组 合 键 ， 打 开 一 幅 素材 图 像 ， 如 图 13-2 所 示 。 
展开 “图 层 ” 面 板 ， 按 Ctrl+J 组 合 键 复 制 “背景 ”图 层 ， 得 到 “图 层 1” 图 层 ， 


如 图 13-3 所 示 。 

选择 “图像 | “调整 "| “自然 饱和 度 ” 命令 , 弹出 “自然 饱和 度 ” 对 话 框 , 设置 “ 目 
尖 亿 和 度 为 30、 “饱和 度 为 13， 单 击 “ 确 定 按钮， 效 朱 如 图 13-4 所 示 。 

按 Ctrl+M 组 合 键 ， 弹 出 “曲线 ”对 话 框 ， 在 曲线 上 单 击 鼠标 左 键 ， 新 建 一 个 
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«AA 


深 制 点 ,在 下 方 设置 “输入 ”为 165、“ 输 出 ”为 145, 单 击 “ 确 定 ”按钮 , 效果 如 图 13-5 所 示 。 


“4 x 
E jm 路 算 一 
Pam Ç @ r. 
正常 v | 不 通明 度 : 100% | ~ 


GD fx °| Q [m Ç WU 


图 13-2 打开 素材 图 像 图 13-3 得 到 “图 层 1” 图 层 


图 13-4 ”调整 饱和 度 效果 图 13-5 执行 “曲线 ”调整 效果 


选择 “图 像 ”|“ 调 整 ”|“ 亮 度 / 对 比 度 ” 命 令 ， 弹出“ 亮度/ 对比度 ”对 话 框 ， 
设置 “对 比 度 ” 为 33， 单 击 “ 确 定 ” 按 钮 ， 增 强 图 像 的 对 比 度 ， 效 果 如 图 13-6 所 示 。 


选择 “ 滤 镜 ”|“ 模 糊 ”|“ 方 框 模 糊 ” 命 令 , 弹出 “ 方 框 模 糊 ” 对 话 框 , 设置 “ 半 


£” 2100 像素 ， 单 击 “ 确 定 按钮 ， 效 朱 如 图 13-7 所 示 。 


YY EU IE i aaa. 


SHIRIKSST vm — — >>>> 


图 13-6 ”增强 图 像 的 对 比 度 图 13-7 模糊 图 像 


应 用 “模糊 ” 滤 镜 ,可 以 使 图 像 中 清晰 度 或 对 比 度 较 强烈 的 区 域 ， 产生 模糊 的 效果 。 


13.1.2 制作 宣传 页 主体 效果 DD 


下 面 介 绍 制作 荔 校 微 课 的 宣传 页 主体 效果 的 方法 。 

22301 选取 工具 箱 中 的 圆 角 和 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 白色 RGB 参 
数值 均 为 255)、“ 描 边 ” 为 无 、“ 半 径 ” 为 25 像素 ， 在 图 像 编辑 窗口 中 绘制 一 个 圆 角 阜 形 ， 
如 图 13-8 所 示 。 
展开 “图 层 ”面板 ， 栅 格 化 “ 圆 角 和 矩形 1” 图 层 ， 并 设置 “不 透明 度 ” 为 
60%, _ 到 13-9 所 示 。 
03| 选取 工具 箱 中 的 椭圆 选 框 工具 ， 在 图 像 编 辑 窗 口中 绘制 一 个 正 圆 选 框 ， 如 
图 13- Ee 有 
按 Delete 键 , 删除 选区 内 的 图 像 ， 单 击 椭圆 工具 属性 栏 中 的 “新 选区 ” 口 按钮 ， 
将 选区 移动 至 合适 位 置 ， 如 图 13-11 所 示 。 

Ez Delete 键 ， 删 除 选区 内 的 图 像 ， 并 取消 选区 ， 效 果 如 图 13-12 所 示 。 
06| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
= fk. “字体 大 小 ”为 10 点 、“ 颜 色 ” 为 灰色 (RGB 参数 值 均 为 93)， 激 活 仿 粗 体 
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图 标 ， 如 图 13-13 所 示 。 


13.8 ”绘制 贺 角 矩形 13-9 设置 不 透明 度 效果 


图 13-10 绘制 正 圆 选 框 13-11 移动 选区 


i 


| 


新 媒体 美工 了 === > 
W 完全 操作 手册 


| <“ x ] 
字符 E= = 
方正 细 黑 一 简体 “| | - “| | 
x 
x | 


图 13-12 取消 选区 图 13-13 设置 各 参数 


专家 所 所 


选区 具有 灵活 操作 性 ， 可 多 次 对 选区 进行 编辑 操作 ， 以 便 得 到 满意 的 选区 形状 。 用 
户 在 创建 选区 时 ， 可 以 对 选区 进行 多 项 修改 ， 如 移动 选区 、 取 消 选 区 、 重 选 选区 、 储 存 
选区 以 及 载 入 选区 等 。 

移动 选区 可 以 使 用 工具 箱 中 的 任何 一 种 选 框 工具 , 是 图 像 处 理 中 最 常用 的 操作 方法 。 
迁 当 地 对 选区 的 位 置 进行 调整 ， 可 以 使 图 像 更 符合 设计 的 要 求 。 用 户 在 编辑 图 像 时 ， 可 
以 取消 不 需要 的 选区 ， 在 Photoshop 中 ， 当 用 户 取消 选区 后 ， 还 可 以 利用 “重新 选择 ” 命 
令 ， 重 选 上 次 放弃 的 选区 ， 灵 活 运 用 “ 重 选 选 区 ”命令 ， 能 够 大 大 提高 工作 的 效率 。 在 
创建 选区 后 ， 为 了 防止 错误 操作 而 造成 选区 丢失 ， 用 户 可 以 先 将 该 选区 保存 。 


在 图 像 编辑 窗口 中 输入 文字 ， 移 至 合适 位 置 ， 效 果 如 图 13-14 所 示 。 

选取 工具 箱 中 的 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 白色 、“ 描 边 ” 为 
在 图 像 编辑 窗口 中 的 适当 位 置 绘制 一 个 矩形 图 形 ， 如 图 13-15 所 示 。 

选取 多 边 形 套 索 工具 ， 在 适当 位 置 绘 制 一 个 三 角形 选区 ， 如 图 13-16 所 示 。 
新 建 “ 图 层 2” 图 层 ， 设 置 前 景色 为 灰色 (RGB 参数 值 均 为 176)， 为 选区 填充 
前 景色 并 取消 选区 ， 如 图 13-17 所 示 。 

复制 “图 层 2” 图 层 , 得 到 “图 层 2 拷贝” 图 层 , 水 平 翻转 图 像 , 并 移 至 合适 位 置 ， 
效果 如 图 13-18 所 示 。 

选取 工具 箱 中 的 横 排 文 字 工具 , 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 一 
粗 宋 简体 ”、“ 字 体 大 小 ”为 18 点 、“ 行 距 ” 为 26 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -50、 


而 


k. 
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“颜色 ”为 监 色 (RGB 参数 值 分 别 为 46、156、211)， 激 活 仿 粗 体 图 标 ， 在 图 像 编辑 窗口 中 输 
和 文字， 如 图 13-19 所 示 。 


龙 飞 老师 倾心 打造 深度 好 课 龙 飞 老师 倾心 打造 深度 好 课 


13-14 ”输入 文字 13-15 ”绘制 窍 形 


龙 飞 老师 


13-16 绘制 三 角形 选区 图 13-17 填充 前 景色 


新 媒体 美工 “一 一 一 pp> 
| 完全 操作 手册 


龙 飞 老师 倾心 打造 深度 好 课 


《摄影 与 人 像 》 


龙 飞 老师 倾心 打造 深度 好 课 


图 13-18 ”移动 图 像 13-19 ”输入 文字 


打开 “课程 主体 psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 上 息 至 背景 图 像 纺 
辑 窗口 中 ， 适 当 调整 图 像 的 位 置 ， 效 果 如 图 13-20 所 示 。 

打开 “标志 .psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 虹 至 背景 图 像 编 辑 窗 
口中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 13-21 所 示 。 


龙 飞 老师 丑 心 打造 深度 好 谍 


《摄影 与 人 像 》 


龙 飞 老师 倾心 打造 深度 好 课 


《摄影 与 人 像 》 


图 13-21 拖 蝶 标志 素材 
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Photoshop 不 仅 可 以 支持 多 种 图 像 的 文件 格式 ， 还 可 以 同时 打开 多 个 图 像 文件 。 若 要 
在 Photoshop 中 编辑 一 个 图 像 文 件 ， 首 先 需 要 将 其 打开 。 和 选择 “文件 |“ 打开 ”命令 ， 
弹出 “打开 ”对话 框 ， 选 择 相应 的 素材 图 像 ， 单 击 “ 确 定 ， 按钮 ， 即 可 打开 素材 图 像 。 


13.2 ”喜马拉雅 广播 活动 页 设计 


喜马拉雅 FM 是 国内 音频 分 享 平台 ， 除 了 拥有 海量 的 节目 音频 之 外 ， 还 是 音频 创作 者 最 
集中 、 最 活跃 的 平台 。 本 实例 主要 介绍 喜马拉雅 FM 平台 中 的 一 个 与 图 书 推广 相关 的 广播 活 
动 贝 设计 ， 最 终 效 琳 如 图 13-22 所 示 。 
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图 13-22 ”实例 效果 


扫 一 扫 观 看 在 线 视频 , 
喜马拉雅 活动 广播 页 设计 


13.2.1 制作 广播 活动 页 背景 效果 时 


下 面 介绍 制作 广播 活动 页 背景 效果 的 方法 。 
按 CtrltHO 组 合 键 ， 打 开 一 幅 素材 图 像 ， 如 图 13-23 所 示 。 
展开 “图 层 ”面板 ， 按 CtrlHJ 组合 键 复制 “背景 ”图 层 ， 得 到 “图 层 1” 图 层 ， 
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设 痢 图 层 的 混合 模式 为 “到 加 ”， 效 霖 如 图 13-24 所 示 。 


图 13-23 ”打开 素材 图 像 图 13-24 得 到 “图 层 1 


22 303] 选择 “窗口 ”| “调整 ”命令 , 展开 “调整 ”面板 , 单 击 “色彩 平衡 ”按钮 , 新 建 “ 色 
彩 平衡 1” 调 整 图 层 ， 如 图 13-25 所 示 。 
在 展开 的 “属性 ”面板 中 设置 各 参数 值 分 别 为 26、-10、+12， 如 图 13-26 所 示 。 


Pp x mQ T rB ° 83 D 色彩 平衡 
正常 v| 不 通明 度 :| 100% | ~ €B: | 中间 调 v 
斌 证: 图 Z + 村 自 填充 : 100% ~ 
@ ë 引 | 色彩 平衡 ! 
© = 背景 拷贝 
© = 背景 ra, 
设置 
co f CQ Q D q ü De 
图 13-25 ”新建 调整 图 层 图 13-26 设置 各 参数 
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2 专家 指点  ) 


“色彩 平衡 ”命令 主要 通过 对 处 于 高 光 、 中 间 调 及 阴影 区 域 中 的 指定 颜色 进行 增加 
或 减少 ， 来 改变 图 像 的 整体 色调 。 
° 色彩 平衡 : 分 别 显示 了 “青色 与 红色 ”“ 洋 红 与 绿色 ”“ 黄 色 与 蓝 色 ”这 3 对 互 
补 的 颜色 ， 每 一 对 颜色 中 间 的 滑 块 可 以 控制 各 主要 色彩 的 增 减 。 
e@ 色调 : 可 以 选择 性 地 调整 图 像 颜色 的 阴影 、 中 间 调 和 高 光 区 域 。 
@ 保持 明度 : 选中 该 复 选 框 ， 图 像 像素 的 亮度 值 不 变 ， 只 有 颜色 值 发 生变 化 。 
EZ. 05 执行 操作 后 ， 此 时 图 像 编辑 窗口 中 的 效果 随 之 变化 ， 如 图 13-27 所 示 。 
在 “调整 ”面板 单 击 “ 上 自然 饱和 度 ” 按 钮 ， 新 建 “ 目 然 饱 和 度 1 调整 图 层 ， 
在 展开 的 “属性 ”面板 中 设置 “ 目 然 饱和 度 ” 为 62， 效 果 如 图 13-28 所 示 。 


图 13-27 ”调整 后 的 图 像 效果 图 13-28 调整 饱和 度 效 果 


按 Shift+Ctri+AlttE 组 合 键 , 盖 印 可 见 图 层 ,得 到 “图 层 2” 图 层 ,选择 “ 滤 镜 ”|“ 模 
糊 画 廊 ”|“ 光 圈 模 糊 ” 命 令 ， 进 入 编辑 界面 ， 调 整 光 圈 的 大 小 与 位 置 ， 如 图 13-29 所 示 。 
单 击 “确定 ”按钮 ， 应 用 “光圈 模糊 ” 滤 镜 ， 效 果 如 图 13-30 所 示 。 


专家 指点 - )) 


光 轿 模糊， 顾名思义 就 是 用 类 似 相 机 的 镜头 来 对 焦 ， 焦 点 周围 的 图 像 会 相应 地 
模糊 。 
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图 13-29 调整 光圈 的 大 小 与 位 置 图 13-30 图像 模 糊 效果 


13.2.2 制作 广播 活动 页 文字 效果 


下 面 介绍 制作 广播 活动 页 文字 效果 的 方法 。 

z2:301 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
大 黑人 简体 ”、“ 字 体 大 小 ”为 18 点 、“ 设 置 所 选 字符 的 字 距 调整 ” 为 -75、 “颜色 ”为 黑色 (RGB 
参数 值 均 为 0)， 激 话 仿 粗 体 图 标 ， 如 图 13-31 所 示 。 

在 图 像 编 辑 窗口 中 输入 文字 ， 移 至 合适 位 置 ， 效 果 如 图 13-32 所 示 。 


图 13-31 设置 各 选项 13-32 输入 文字 
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复制 刚刚 输入 的 文字 ， 并 将 其 移动 至 合适 位 置 ， 在 “字符 ”面板 中 ， 设 置 “ 字 
体系 列 ”为 “Adobe 黑体 Std”、“ 设 置 所 选 字符 的 字 距 调整 ”为 -<50， 颜 色 为 黑色 ， 运 用 机 
排 文 字 工具 修改 文本 内 容 ， 效 果 如 图 13-33 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
粗 倩 简体 ”、“ 字 体 大 小 ”为 13 点 、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 255)， 在 图 像 编辑 窗 
口中 输入 文字 ， 效 果 如 图 13-34 所 示 。 
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图 13-33 ”修改 文本 内 容 13-34 输入 文字 


选择 相应 文字 图 层 ， 在 缩 览 图 中 单 击 鼠 标 右键 ， 在 弹出 的 快捷 菜单 中 选择 “ 混 
合 选项 ”命令 ， 如 图 13-35 所 示 。 

打开 “图 层 样 式 ” 对 话 框 ， 选中 “ 描 边 ” 复 选 框 , 设置 “大 小 ”为 5 像素 、“ 颜 
色 ” 为 黄色 (RGB 参数 值 分 别 为 241、226、47)， 如 图 13-36 所 示 。 
单 击 “ 确 定 ”按钮 ， 即 可 为 文字 添加 “ 描 边 ”图 层 样式 ， 效果 如 图 13-37 所 示 。 
在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 粗 倩 简体 ”、“ 字 体 大 小 ”为 15 点 、 
“颜色 ”为 白色 (RGB 参数 值 均 为 255)， 并 激活 仿 粗 体 图 标 , 在 图 像 编 辑 窗口 中 输入 相应 字符 ， 
效 朱 如 图 13-38 所 示 。 
打开 “文字 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 归 至 背景 图 像 编辑 窗 
口中 ， 适 当 调整 图 像 的 位 置 ， 效 果 如 图 13-39 所 示 。 
打开 “标志 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 归 至 背景 图 像 编辑 窗 
口中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 13-40 所 示 。 


i 


ms U 


新 媒体 美工 * 一 一 一 
s 完全 操作 手册 


快速 导出 为 PING 
导出 为 .… 


来 各 图 层 的 画板 .. 
sesar 


| 


*PATTETI 


创建 工作 第 径 


图 13-35 选择 “混合 选项 ”命令 
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图 13-37 添加 图 层 样 式 
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图 13-36 设置 参数 
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图 13-38 ”输入 字符 


学 高 手 做 炬 ， 以 右 钱 到 黄金 ， 从 对 比 到 色 索 ， 
物 图 汗 法 逐一 揭秘 司 专 是 拍 浇 从 人 懈 到 风光 
， 上 以 微 距 到 夜 遇 ， 主 题 拍 概 全 程 汗 蚌 。 
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如 今 ， 新 媒体 平台 已 经 不 能 满足 互联 网 内 容 的 需求 ， 很 多 独特 的 内 容 创 业 
者 开始 寻找 新 的 渠道 来 展示 内 容 ， 其 中 视频 直播 平台 被 他 们 看 中 ， 成 为 火热 的 
内 容 平 台 。 视 频 可 以 让 内 容 立 体 化 呈现 ， 拥 有 比 文字 、 图 片 等 内 容 形 式 更 强 的 
吸引 力 。 本 章 主 要 介绍 视频 直播 类 的 新 媒体 视 锅 设计 方法 。 
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@ YY 主播 模 幅 推广 设计 
@ 虎牙 游戏 直播 页 面 设 计 


— 
W mx, m tsa" 


【直播 时 间 ] 
| 18:00-20:00 
"y (zv s) /" 


内 容 : 陀螺 仪 怎么 压 枪 ”陀螺 仪 压 枪 技巧 
烛 些 群 : x x x x X x x 直播 通知 群 : x x x X x xx 


新 媒体 美工 YF ma = maa a 


14.1 YY 主播 模 幅 推广 设计 


从 YY 开始 直播 至 今 ， 直 播 市 场 已 经 经 历 了 7 年 多 的 发 展 历程 ， 尤 其 是 2013 年 的 游戏 直 
播 兴 起 ， 互 联网 上 涌现 了 一 大 批 直播 平台 。 如 今 ， 直 播 行业 进入 了 发 展 的 高 峰 期 ， 同 时 直播 
主播 类 人 物 IP 也 正式 形成 了 一 套 完善 的 输出 产业 链 ， 当 然 这 其 中 也 少不了 视觉 的 包装 。 例 如 ， 
本 实例 介绍 的 就 是 一 个 YY 直播 平台 的 主播 顶部 横幅 广告 设计 。 

本 实例 最 终 效 果 如 图 14-1 所 示 。 
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14-1 实例 效果 
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14.1.1 制作 横幅 广告 主体 效果 


下 面 详细 介绍 制作 YY 主播 模 幅 广告 主体 效 灯 的 方法 。 

按 Ctrl+O 组 合 键 , 打开 “背景 jpg” 素 材 图 像 ， 如 图 14-2 所 示 。 

按 CtrltO 组 合 键 ， 打 开 “ 主 播 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
忠 至 背景 图 像 编 辑 窗 口中 ,适当 调整 图 像 的 位 置 ， 效 果 如 图 14-3 所 示 。 


图 14-2 ”打开 硝 景 素材 14-3 拖 抱 人 物 素材 
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移动 图 像 至 合适 位 置 ， 适 当 放 大 图 像 ， 效 果 如 图 14-4 所 示 。 
按 Ctrl+O 组 合 键 ， 打开“ 兔子 耳 打 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 
像 拖 电 至 背景 图 像 编 辑 窗 口中 ， 适 当 调 整 图像 的 位 置 ， 效 果 如 图 14-5 所 示 。 
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用 户 在 Photoshop 中 处 理 图 像 时 ， 为 了 充分 利用 编辑 窗口 的 空间 ， 就 必须 要 调整 面板 
的 大 小 。 在 Photoshop 中 编辑 图 像 时 ， 用 户 可 以 根据 个 人 的 习惯 随意 移动 面板 ， 或 者 调整 
面板 的 大 小 。 


i § | 了 | 
图 14-4 ”调整 图 像 大 小 和 位 置 图 14-5 ” 拖 曙 和 半 饰 素材 
14.1.2 ”制作 横幅 广告 文字 效果 ) 


下 面 详细 介绍 制作 YY 主播 横幅 广告 文字 效 末 的 方法 。 
选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
综 乙 向 体 ”、 字体 大 小 为 98 点 、 “设置 所 选 字 符 的 字 距 调整 为 200、 颜色 ”为 棕色 (RGB 
参数 值 分 别 为 202、121、0)， 在 图 像 编 辑 窗口 中 输入 主体 文字 ， 如 图 14-6 所 示 。 

选择 “图 层 | “图 层 样 式 ”|“ 摘 了 边 ” 命 令 , 弹出 “图 层 样 式 ” 对 话 框 , 设置 “大 
小 ”为 5 像素 、“ 颜 色 ” 为 日 色 (RGB 参数 值 均 为 255)， 如 图 14-7 所 示 。 


专家 指点 )) 
“图 层 样 式 ” 可 以 为 当前 图 层 添加 特殊 效果 ,如 投影 、 内 阴影 、 外 发 光 以 及 浮雕 等 样式 ， 
在 不 同 的 图 层 中 应 用 不 同 的 图 层 样式 ， 可 以 使 整 幅 图 像 更 加 富有 真实 感 和 突出 性 。 
选中 “投影 ” 复 选 框 ,设置 “不 透明 度 ” 为 66%、“ 角 度 ” 为 90 度 、“ 距 离 ” 
为 6 像素 、 扩展 为 45%、 大 小 为 8 像素 ， 如 图 14-8 所 示 。 
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单 击 “确定 ”按钮 ， 即 可 为 文字 添加 图 层 样式 ， 效 果 如 图 14-9 所 示 。 


图 14-7 ”设置 “ 描 边 ”图 层 样式 


| 中 DY 让 
| (a): 
| 去 h(t > 


14-8 设置 “投影 ”图 层 梓 式 图 14-9 ”添加 图 层 样式 效果 


按 住 Ctrl 键 的 同时 单 击 文字 图 层 的 图 层 缩 览 图 ， 载 和 选区， 如 图 14-10 所 示 。 
选择 “选择 ”| “修改 ”| 扩展 ”命令 , 弹出 “扩展 选区 ”对 话 框 , 设置 “扩展 量 ” 
为 12 像素 ， 单 击 “ 确 定 ”按钮 ， 即 可 扩展 选区 ， 如 图 14-11 所 示 。 


图 14-10 载 入 选区 14-11 扩展 选区 


设置 前 景色 为 深 青 色 (RGB 参数 值 分 别 为 7、175、188)， 新 建 一 个 图 层 ， 并 为 
选区 填充 前 景色 ， 如 图 14-12 所 示 。 
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按 Ctrl+D 组 合 键 ， 取 消 选 区 ， 将 图 层 调整 至 文字 图 层 下 方 ， 并 适当 调整 图 像 
的 位 置 ， 效 果 如 图 14-13 所 示 。 


图 14-12 ”填充 前 景 图 14-13 ”调整 图 层 顺序 


09| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
卡通 简体， 、 “字体 大 小 ”为 72 点 、“ 设 置 所 选 字 符 的 字 忠 调整 ”为 200、“ 颜 色 ” 为 淡 黄 
色 (RGB 参数 值 分 别 为 239、255、167)， 在 图 像 编 辑 窗口 中 输入 文字 ， 如 图 14-14 所 示 。 
单 击 “ 图 层 ” 面 板 底 部 的 “添加 图 层 样式 ”按钮 , 在 弹出 的 快捷 菜单 中 选择 “ 投 
影 ” 选 项 ,弹出 “图 层 样 式 ” 对 话 框 ,设置 “不 透明 度 ” 为 73%、 “角度 为 90 度 、 距离 
为 4 像素 、 大 小 为 4 像素 ， 如 图 14-15 所 示 。 


图 14-14 输入 文字 图 14-15 IE FZ š 


选中 “ 描 边 ” 复 选 框 , 设置 “大 小 ”为 2 像素 、“ 颜 色 ” 为 棕色 (RGB 参数 值 
分 别 为 100、49、0),， 单 而 “确定 ”按钮 ， 即 可 为 文字 添加 图 层 样 式 ， 如 图 14-16 所 示 。 
复制 刚刚 输入 的 文字 , 将 其 移动 至 合适 位 置 , 运用 横 排 文字 工具 修改 文本 内 容 ， 
效果 如 图 14-17 所 示 。 


通过 复制 与 粘贴 图 层 样式 ， 可 以 减少 重复 操作 。 在 操作 时 ， 首 先 选择 包含 要 复制 的 
图 层 样式 的 源 图 层 ， 在 该 图 层 的 图 层 名 称 上 单 击 筷 标 右键 ,在 弹出 的 快捷 菜单 中 选择 “ 找 
贝 图 层 样式 ”选项 ， 即 可 描 贝 图 层 样 式 。 
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图 14-16 添加 图 层 样 式 效 果 图 14-17 修改 文本 内 容 


44.2 ”虎牙 游戏 直播 页 面 设 计 


在 制作 游戏 直播 间 时 ， 先 运用 图 层 样式 制作 出 紫色 立体 的 边框 ， 再 用 椭圆 工具 绘制 出 多 
个 圆 形 ， 拖 入 头像 与 装饰 素材 ， 最 后 添加 适当 说 明 性 文字 ， 即 可 完成 设计 。 
本 实例 最 终 效果 如 图 14-18 所 示 。 


M 喜欢 我， 就 关注 我 吧 ” 


[直播 时 间 】 
18:00-=20:00 


= 


内 容 : 陀螺 仪 怎么 压 枪 ? 陀螺 仪 压 枪 技巧 
WOPEBE, X X X X X Xx 直播 通知 群 : x X X X X X x 


图 14-18 ”实例 效果 


扫 一 扫 观 看 在 线 视频 , 
虎牙 游戏 直播 界面 设 于 


14.2.1 制作 游戏 直播 页 面 主 体 效果 JU | 


下 面 详细 介绍 制作 话 戏 二 播 间 主体 的 方法 。 
选择 文件 | 新 建 ” 命令， 弹出 “新 建文 档 ” 对 话 框 ， 设 置 “ 名 称 为 “ 游 
戏 直 播 间 、 宽度 为 1920 像素 、 ”高度 为 1080 像素 、“ 分辨 率 ”为 300 像素/ 英寸 、“ 颜 
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色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 如 图 14-19 所 示 ， 单 击 “ 创 建 ” 按 钮 ， 
新 建 一 个 空白 图 像 。 

在 “图 层 ” 面 板 中 新 建 “ 图 层 1” 图 层 ， 并 为 图 层 填充 深蓝 色 (RGB 参数 值 分 
别 为 56、105、160)， 效 果 如 图 14-20 所 示 。 


(O minim ms | 照片 Hm 图 稿 和 托 图 Web — 称 动 设备 腋 片 和 寓 频 


图 14-19 新建 空白 文档 图 14-20 ”填充 深蓝 色 
选取 工具 箱 中 的 圆 角 抵 形 工具 ， 在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “ 形 


状 ”、“ 填 充 ” 为 无 、“ 描 边 ”为 黄色 (RGB 参数 值 分 别 为 55、200、59)、“ 描 边 宽度 ”为 
1 像素 si 为 20 像素 ， 在 图 像 编辑 窗口 中 绘制 一 个 圆 角 矩 形 图 形 ， 如 图 14-21 所 示 。 

04| 双击 “ 圆 角 年 形 1” 图 层 ， 弹 出 “图 层 样式 ” 对 话 框 ， 选 中 “投影 ” 复 选 杠 ， 
设置 -不通 明度 为 75%、“ 角 度 ” 为 90 度 、“ 距 离 ”为 3 像素 、“ 扩 展 ”为 20%、“ 大 小 ” 
为 10 像素 ， 单 击 “ 确 定 ” 按 钮 ， 即 可 添加 投影 图 层 样式 ， 如 图 14-22 所 示 。 


当 用 户 只 需要 复制 原 图 像 中 的 某 个 图 层 样式 时 ， 可 以 在 “图 层 ” 面 板 中 按 住 Alt 键 的 
同时 ， 单 击 鼠 标 左 键 并 拖 擅 这 个 图 层 样 式 至 目标 图 层 中 即 可 。 


sms 


图 14-21 绘制 圆 角 和 矩形 图 14-22 ”添加 投影 图 层 样 式 
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专 冢 指 尽 


当 用 户 只 需要 复制 原 图 像 中 的 某 个 图 层 样 式 时 ， 可 以 在 “图 层 ”面板 中 按 住 Alt 键 的 
同时 ， 单 击 和 鼠标 左 键 并 抑 久 这 个 图 层 样 式 至 目标 图 层 中 即 可 。 
Ë: Ctrl+O 组 合 键 ， 打 开 “ 游 戏 界面 jpg” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 
像 拖 忠 至 背景 图 像 编 辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 14-23 所 示 。 
选择 “图 像 ”| “调整”"| “自然 饱和 度 ” 命令 , 弹出 “自然 饱和 度 ”对 话 框 , 设置 “ 自 
然 饱 和 度 ” 为 50、“ 饱 和 度 ” 为 10， 单 击 “ 确 定 ”按钮 ， 增 加 画面 的 色彩 饱和 度 ， 效 果 如 
图 14-24 所 示 。 


图 14-23 ” 拖 忠 游戏 界面 素材 图 14-24 ”图像 效果 


14.2.2 制作 游戏 直播 页 面 细 节 效 果 JW 
下 面 详 细 介 绍 制作 游戏 直播 间 细 区 效 末 的 方法 。 

选取 工具 箱 中 的 椭圆 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 深蓝 色 (RGB 参数 
值 分 别 为 80、4、173)、“ 描 边 ” 为 无 , 在 图 像 编 辑 窗口 中 绘制 一 个 椭圆 形状 , 如 图 14-25 所 示 。 
复制 “椭圆 1” 图 层 ， 得 到 “椭圆 1 拷贝 ”图 层 ， 按 Ctrl+T 组 合 键 ， 调 出 变换 
控制 框 ， 按 住 ShifttrAlt 组 合 键 的 同时 拖 归 控制 框 四 周 的 控制 柄 ， 从 中 心 等 比例 缩小 图 像 ， 如 
图 14-26 所 示 。 


图 14-25 ”绘制 椭圆 选 框 图 14-26 ”从 中 心 等 比例 缩小 图 像 


按 Enter 键 确 认 变换 ， 展 开 “ 属 性 ”面板 ， 设 置 “ 填 充 ” 为 紫色 (RGB 参数 值 


ES 


直播 平台 : ËB 
全 主播 推广 与 游戏 直播 设计 恬 


分 别 为 107、23、225)， 效 果 如 图 14-27 所 示 。 
按 Ctrl+O 组 合 键 ， 打 开 “ 主 播 头 像 psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 
至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 大 小 与 位 置 ， 效 果 如 图 14-28 所 示 。 


14-27 设置 “填充 ”颜色 图 14-28 ” 拖 遇 主播 头像 素材 


选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “Adobe 
黑体 Std”、“ 字 体 大 小 ”为 14 点 、“ 颜 色 ” 为 玫 红 色 (RGB 参数 值 分 别 为 231、39、241)， 
选中 “椭圆 1 拷贝 ”图 层 ， 图 像 中 会 显示 “椭圆 1 拷贝 ”的 路 径 ， 在 合适 位 置 单 击 鼠 标 左 键 ， 
确定 插入 点 。 输 入 相应 文字 ， 并 按 Ctrl+Enter 组 合 键 确 认输 入 ， 如 图 14-29 所 示 。 

双击 文字 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “ 描 边 ” 复 选 框 ,设置 “大 小 ” 
为 5 像素、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 255)， 如 图 14-30 所 示 。 


| 


[S| 


图 14-29 输入 文字 图 14-30 ”设置 “ 描 边 ”参数 


路 径 是 Photoshop 中 的 强大 功能 之 一 ， 它 是 基于 贝 塞 尔 曲线 建立 的 矢量 图 形 ， 所 有 使 
用 矢量 绘图 软件 或 矢量 绘图 制作 的 线条 ， 原 则 上 都 可 以 称 为 路 径 。 路 径 是 通过 钢笔 工具 
或 形状 工具 创建 出 的 直线 和 曲线 ， 因 此 ， 无 论 路 径 缩 小 或 放大 都 不 会 影响 其 分 辨 率 ， 保 
椭圆 工具 |@ 
是 绘制 的 形状 不 同 。 


可 以 绘制 杭 国 或 国 形 图 形 ， 其 使 用 方法 与 矩形 工具 的 操作 方法 相同 ， 只 
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Ë Photoshop 中 ,文字 具有 极为 特殊 的 属性 ， 当 用 户 输入 相应 文字 后 ， 文 字 表 现 为 一 
个 文字 图 层 ， 文 字 图 层 具 有 与 普通 图 层 不 一 样 的 可 操作 性 。 例 如 ， 在 文字 图 层 中 无 法 使 
用 画笔 工具 、 铅 笔 工 具 、 渐 变 工 具 等 工具 ,只 能 对 文字 进行 变换 、 改 变 颜色 等 有 限 的 操作 ， 
当 用 户 对 文字 图 层 使 用 上 述 工 具 操 作 时 ， 则 需要 将 文字 栅 格 化 。 
选中 “和 斜面 和 浮雕 ” 复 选 框 ， 保 持 默 认 设 置 即 可 ， 单 击 “ 确 定 ”按钮 ， 为 文字 
添加 相应 图 层 样式 ， 效 果 如 图 14-31 所 示 。 


按 Ctrl+O 组 合 键 ， 打 开 “ 文 字 .psd 素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
虑 至 背景 图 像 编辑 窗口 中 ， 适 当 调整 图 像 的 位 置 ， 效 末 如 图 14-32 所 示 。 


内 容 : 陀 归 仪 怎么 压 枪 ? PesaRIXO R 161515 
O3EBE: x X X X X X X 直 氮 通知 群 : x< x x x x x x 


图 14-31 添加 相应 图 层 样式 图 14-32 ” 拖 奥 文字 素材 
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随 着 新 媒体 和 内 容 营 销 的 迅速 崛起 ， 如 何在 电 商 运营 中 利用 视 锅 营销 提高 
品牌 、 店 铺 和 产品 的 知名 度 并 创造 利润 ? 这 个 问题 是 淘宝 、 天 独 运 营 者 关注 的 
里 局， 也 是 玲 局 。 本草 主要 介绍 电 商 平台 的 新 党 体 夫 工 设计 案例 。 


本 章 重 点 导航 


9 美 妆 网 店 海 报 设计 
@ 厨具 网 店 证 情 页 设计 


Gl 4G | 0.1K/s ' Ei Ü = 16% ( BH 
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首页 视频 全 部 宝 见 TER 


¿z à 粉丝 活动 群 


JA: 


=E K AKEEIR PTS A TSS GINI ER 
锅 家 用 电磁 炉 燃 气 灶 适 用 锅 具 


满 44 碱 5 优惠 状 : 满 44 属 5 做 惠 兰 


SHIRIK2SET YVmm== > 


15.1 美 妆 网 店 海报 设计 


本 案例 是 为 美 妆 网 店 设计 的 首页 欢迎 模块 。 在 画面 的 配色 中 借鉴 商品 的 色彩 ， 并 通过 大 
小 和 外 形 不 同 的 文字 来 表现 店铺 的 主题 内 容 ， 使 用 同一 色 系 的 颜色 来 提升 画面 的 品质 ， 能 够 
使 设计 的 整体 效果 更 加 协调 统一 。 

本 实例 最 终 效 果 如 图 15-1 所 示 。 


视频 ”全 部 宝贝 ” 新品 HE 


= PN: 
Ë I 3k... K 


注 剧 粉 毕 活动 群 


mm. 


图 15-1 实例 效果 


扫 一 扫 观 看 在 线 视 频 . 
美 妆 网 店 海 报 设 计 


15.1.1 制作 纯色 渐变 效果 JU 


下 面 介绍 制作 美 妆 网 店 首 页 纯色 渐变 育 景 效果 的 方法 。 


选择 “文件 ”|“ 新 建 ” 命 令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设置“ 名称 ”为 “ 美 
妆 网 店 海报 设计 、 宽度 ”为 800 像素 、 “高度 ”为 500 人 像素、 分辨 率 "为 300 像 素 / 英 寸 、 颜 
色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 如 图 15-2 所 示 ， 单 击 “ 创 建 ”按钮 ， 
新 建 一 个 空 日 图 像 。 

选取 工具 箱 中 的 渐变 工具 ， 设 置 渐变 色 为 红色 到 白色 ,设置 0% 位 置 为 红色 
(RGB 参数 值 分 别 为 247、36、67)、100% 位 置 为 白色 (RGB 参数 值 均 为 255)， 如 图 15-3 所 示 。 
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( AQ... ) 
( 存 馆 (5). ) 


打印 
| 名称 (N): (me C ) 
ee. 变 类 型 : 实 底 ~ 


[š] [š] u | 平滑 度 (M): 100 + % 


Ld Esa] 


[u m (C): % — MMER(D) 


图 15-3 ”设置 渐变 色 


在 “图 层 ” 面 板 中 ， 新 建 “ 图 层 1” 图 层 ， 如 图 15-4 所 示 。 
在 工具 属性 栏 中 单 击 “ 线 性 渐变 ”按钮 ， 在 图 像 上 拖 忠 鼠标 填充 渐变 色 ， 如 
15-5 所 示 。 


— 
== = 
Ph x B) Q T r Bp 9 
正常 v 不 透明 度 : 100% ~ 
WE: 图 Z + TS 自 填充 : 100% V 


1 1 < I 创建 | 


Go f O @ 口 C] Wi 
图 15-4 新建 “图 层 1” 图 层 图 15-5 ”填充 渐变 


按 CtrltO 组 合 键 ， 打开 “商品 1psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
忠 至 背景 图 像 编 辑 窗 口中 的 合适 位 置 ， 如 图 15-6 所 示 。 
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选择 “图 像 | 调整 | 亮度/ 对比度” 命令， 弹出 “亮度 /对比 度 ” 对 话 框 ， 
设 羡 “亮度 为 10、 对 比 度 为 -23， 单 击 “ 确 定 按钮 ， 效 坟 如 图 15-7 所 示 。 


图 15-6 拖 息 商品 素材 图 15-7 调整 亮度 和 对 比 度 饱 和 度 效果 


专家 折扣 )) 


“自然 饱和 度 ” 命 令 可 以 调整 整 幅 图 像 或 单个 颜色 的 饱和 度 和 亮度 值 。 

@ 色相: 色相 是 各 类 闫 色 的 相貌 称谓 ， 用 于 改变 图 像 的 凑 色 。 可 通过 在 该 数值 框 中 
输入 数值 或 拖 动 滑 块 来 调整 。 

@ 饱和 度 : 饱和 度 是 指 色 彩 的 鲜艳 程度 ， 也 称 为 色彩 的 纯度 。 设 置 数值 越 大 ， 色 彩 
越 鲜 艳 ， 数 值 越 小 ， 就 越 接近 黑白 图 像 。 


复制 “商品 1” 图 层 , 将 其 进行 垂直 翻转 并 调整 至 合适 位 置 , 效果 如 图 15-8 所 示 。 
为 复制 的 图 层 添加 图 层 蒙 版 ， 并 填充 白色 到 黑色 的 线性 渐变 ， 设 置 图 层 的 “不 
透明 度 ” 为 30%， 制 作 倒 影 效果 ， 如 图 15-9 所 示 。 


图 15-8 复制 并 调整 素材 图 像 15-9 制作 倒影 效果 


Ë 


淘宝 网 店 - Ë 
<<<<< 店铺 海报 与 详情 装修 设计 蜗 


15.1.2 制作 海报 文字 效果 DD 


网 店 卖家 使 用 横 排 文字 工具 给 商品 添加 解释 说 明 ， 可 以 让 买 家 更 了 解 商 品 。 下 面 详 细 介 
绍 制作 美 妆 网 店 首页 文案 的 方法 。 

按 Ctd+O 组 合 键 ， 打 开 “ 装 饰 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
电 至 背景 图 像 编 辑 窗口 中 的 合适 位 置 ， 如 图 15-10 所 示 。 

02| 选取 工具 箱 中 的 渐变 工具 ， 设 置 渐变 色 为 深 红色 到 浅 红 ， 位 置 0% 为 深 红色 
(RGB 参数 值 分 别 为 180、0、42)、 位 置 24% 为 浅 红色 (RGB 参数 值 分 别 为 235、0、49)、 位 
置 55% 为 深 红色 (RGB 参数 值 分 别 为 180、0、42)、 位 置 78% 为 浅 红色 (RGB 参数 值 分 别 为 
235、0、49)、 位 置 100% 为 深 红色 (RGB 参数 值 分 别 为 80、0、42)， 锁 定 “ 装 饰 ”图 层 的 
透明 像素 ， 在 工具 属性 栏 中 单 击 “ 线 性 渐变 ”按钮 ， 在 图 像 上 拖 虑 鼠标 填充 渐变 色 ， 效 果 如 
15-11 所 示 。 


图 15-10” 拖 蝶 素材 涂饰 图 15-11 填充 渐变 色 


22: 303 运用 横 排 文字 工具 在 图 像 编辑 窗口 输入 相应 文字 ， 设 置 “ 字 体系 列 ” 为 “方正 
中 倩 简体 ”、“ 字 体 大 小 ”为 6.5 点 、“ 颜 色 ” 为 日 色 ， 效 果 如 图 15-12 所 示 。 

22: 804 运用 横 排 文字 工具 在 图 像 编辑 窗口 中 输入 相应 文字 ,设置 “字体 系列 ”为 “ 方 
正 圭 体 简 体 ”、“ 字 体 大 小 ”为 5 点、“ 颜 色 ” 为 日 色 。 选 择 工 具 箱 中 的 直线 工具 ， 设 置 “ 描 
边 为 2 像素 、“ 填 充 ”为 无 ， 在 文字 上 绘制 一 条 直线 ， 效 朱 如 图 15-13 所 示 。 
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图 15-12 输入 相应 文字 图 15-13 ”选取 横 排 文字 工具 
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按 CtrltO 组 合 键 ， 打 开 “ 文 字 1psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
眼 至 背景 图 像 编辑 窗口 中 的 合适 位 置 ， 如 图 15-14 所 示 。 

按 Ctrl+O 组 合 键 ,打开 “玫瑰 花 jpg ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
忠 至 背景 图 像 编 辑 窗口 中 的 合适 位 置 , 放置 在 图 层 1 的 上 面 , 然后 选择 橡皮 探 工具 , 设置 硬 
度 为 0%、 不 透明 度 ”为 36%， 探 除 部 分 图 像 ， 效 未 如 图 15-15 所 示 。 


D82412] S: 21 的 瑰 补 水 系列 


图 15-14 ” 拖 遇 文字 素材 图 15-15 ” 拖 擅 玫瑰 花 素材 
按 Ctrl+O 组 合 键 ， 打开 “水 花 .png ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 息 至 
背景 图 像 编 辑 窗口 中 ， 适 当 调 整 图 像 的 大 小 和 位 置 ， 如 图 15-16 所 示 。 
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图 15-16 最 终 效果 


15.2， 厨具 网 店 详情 页 设计 


本 案例 是 为 某 品 牌 的 厨具 店铺 设计 的 平底 锅 商品 主 图 ， 在 制作 的 过 程 中 使 用 了 鲜艳 的 背 
景 图 片 进 行 修饰 ,添加 “赠品 ”促销 方案 ,以 及 向 单 的 厂 告 词 来 突出 产品 优势 。 
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本 实例 最 终 效 朱 如 图 15-17 所 示 。 
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限时 限量 疯狂 抢购 


店铺 优惠 券 满 44 减 5 优惠 养 ; 满 44 威 5 优惠 券 


15-17 ”实例 效果 


扫 一 扫 观 看 在 线 视 频 . 
厨具 网 店 详 情 页 设计 


15.2.1 制作 网 店 详情 页 主体 效果 


Ku i 厨具 网 店主 图 主体 效果 的 方法 。 


01] 选择 “文件 ”|“ 新 建 ” 命 令 ， 弹出“ 新建 文档” 对 话 框 ， 设 置 “ 名 称 ” 为 “ 厨 
m. “宽度 ”为 722 像素 、“ 高 度 ” 为 722 像素 、“ 分 辨 率 ” 为 72 像素 /英寸 、 
“颜色 模式 ”为 “RGB 颜色 ”、“ 背 景 内容 ” 为 “白色 ”， 单 击 “创建 ”按钮 ， 新 建 一 个 空 
日 图 像 ， 如 图 15-18 所 示 。 


按 CtrltO 组 合 键 ， 打 开 “ 商 品 2jpg ”素材 图 像 ， 运 用 移动 工具 将 商品 图 像 拖 
忠 至 背景 图 像 编 辑 窗 口中 ， 如 图 15-19 所 示 。 
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图 15-18 ”新 建 空 白文 档 图 15-19 ”添加 商品 素材 
15.2.2 制作 网 店 详情 页 文字 效果 = 


给 商品 主 图 添加 文字 说 明 ， 可 以 增强 主 图 的 视觉 效果 。 下 面 介绍 制作 厨具 网 店主 图 文字 
宣传 效果 的 方法 。 

选择 工具 箱 中 的 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 红色 (RGB 值 分 别 
为 255、0、0)，“ 描 边 ” 为 无 ， 绘 制 一 个 矩形 框 ， 如 图 15-20 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 , 选择 “窗口 ”| “字符 ”命令 , 弹出 “字符 ”面板 ， 
设置 “字体 系列 ”为 “方正 黑体 简体 ”、“ 字 体 大 小 ”为 55 点 、“ 设 置 所 选 字符 的 字 距 调整 ” 
为 200、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 255)， 激 活 仿 粗 体 图 标 ， 在 商品 图 像 的 右上 方 输 
入 相应 的 文字 ， 如 图 15-21 所 示 。 


图 15-20 ”绘制 窍 形 框 图 15-21 输入 文字 
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选择 工具 箱 中 的 横 排 文字 工具 ， 展 开 “ 字 符 ” 面 板 ， 设 置 “ 字 体系 列 ” 为 “ 方 
正 粗 宋 简 体 ”、“ 字 体 大 小 ”为 42 点 、“ 颜 色 ” 设 置 为 红色 (RGB 参数 值 分 别 为 255、0、0)， 
在 左上 方 输入 相应 的 文字 ， 如 图 15-22 所 示 。 

选择 工具 箱 中 的 贺 角 和 矩形 工具 ,设置 填充 颜色 为 红色 (RGB 参数 值 分 别 为 
255、0、0)、“ 描 边 ” 为 无 、“ 半 径 ” 为 15 像素 ,绘制 一 个 圆 角 矩形， 如 图 15-23 所 示 。 
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图 15-22 输入 文字 图 15-23 ”绘制 圆 角 和 矩形 框 

复制 圆 角 矩形 图 像 2 次 ， 并 适当 地 调整 各 图 像 的 位 置 ， 如 图 15-24 所 示 。 

使 用 横 排 文字 工具 在 图 像 编 辑 窗口 中 的 合适 位 置 单 击 鼠 标 左 键 并 确认 插入 点 ， 
展开 “字符 ”面板 ,设置 “字体 系列 ”为 “微软 雅 黑 ”、“ 字 体 大 小 ”为 25 点 、“ 颜 色 ” 
为 白色 RGB 参数 值 均 为 255)、“ 设 置 所 选 字 符 的 字 距 调整 ”为 200， 输 入 相应 的 文字 ， 如 
1525 Ha 
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图 15-24 复制 矩形 图 15-25 输入 相应 的 文字 
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按 CtrltO 组 合 键 ， 打 开 “ 商 品 3psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 归 至 背 
景 图 像 编 辑 窗口 中 ， 并 调整 图 像 的 大 小 和 位 置 ， 如 图 15-26 所 示 。 

选择 工具 箱 中 的 椭圆 工具 ,在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “形状 ”、 
设置 “填充 ”为 红色 (RGB 参数 值 分 别 为 255、24、24)、“ 描 边 ”为 无 ， 按 住 Shift 键 ， 绘 制 
一 个 正 圆 图 形 ， 效 果 如 图 15-27 所 示 。 


第 二 代 不 粘 锅  PME KOR: U 全 国 包 邮 


图 15-26 ” 拖 遇 素材 图 15-27 ”绘制 正 贺 


选取 工具 箱 中 的 横 排 文字 工具 ， 展 开 “ 字 符 ” 面 板 ， 设 置 “字体 系列 ”为 “ 方 
正 粗 宋 简 体 ”、“ 字 体 大 小 ”为 46 点 、“ 颜 色 ” 为 黄色 (RGB 值 分 别 为 246、233、19)， 输 
入 相应 的 文字 ， 根 据 需要 适当 地 调整 文字 的 位 置 ， 如 图 15-28 所 示 。 

按 CtrlO 组 合 键 ， 打 开 “ 价 格 框 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 
拖 电 至 背景 图 像 编辑 窗口 中 的 合适 位 置 ， 如 图 15-29 所 示 。 
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图 15-28 输入 文字 图 19-29 ” 拖 忠 素材 
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选择 工具 箱 中 的 圆 角 和 矩 形 工 具 ， 设置 “ 描 边 ”为 无 、“ 半 径 ” 为 30 像素 、“ 颜 
色 ” 为 黄色 (RGB 参数 值 分 别 为 246、179、19)， 在 图 像 编 辑 窗口 绘制 一 个 价格 框 ， 效 果 如 
15-3D pop. 

按 CtrltO 组 合 键 ， 打 开 “ 文 字 2.psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 背 
景 图 像 编 辑 窗口 中 ， 并 调整 图 像 至 合适 的 位 置 ， 如 图 15-31 所 示 。 


图 15-30 ”绘制 价格 框 图 15-31 拖 忠 “文字 ”素材 
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新 媒体 广告 设计 主要 是 将 广告 的 主题 、 创 意 、 语 言 文字 、 形 象 以 及 宰 托 等 
要 素 进行 组 合 安排 ,通过 广告 来 达到 吸引 用 户 眼 球 的 目的 ， 从 而 实现 引流 吸 粉 、 
推广 产品 和 品牌 的 目标 。 本 章 主 要 介绍 海报 、 推 广 页 等 广告 设计 案例 。 
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16. 天 猫 商场 广告 设计 


本 实例 设计 的 是 一 幅 天 猫 族 舰 店 的 商场 主页 宣传 海报 ， 海 报 是 一 种 比较 直接 、 灵 活 的 广 
告 宣 传 形 式 ， 它 是 产品 销售 活动 中 的 最 后 一 个 环节 ， 能 在 商品 销售 的 现场 营造 出 良好 的 商业 
氛围 ， 引 起 消费 冲动 ， 产 生 购买 欲 。 

本 实例 最 终 效 果 如 图 16-1 所 示 。 
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图 16-1 实例 效果 
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16.1.1 制作 海报 背景 效果 | 
下 面 介绍 制作 百货 海报 背景 的 效果 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 一 幅 素材 图 像 ， 如 图 16-2 所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 沙 漠 jpg” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 背 
景 图 像 编辑 窗 口中 的 合适 位 置 ， 如 图 16-3 所 示 。 

在 “图 层 ”面板 中 , 设置 “图 层 1” 图 层 的 “混合 模式 ”为 “溶解 ”、“ 不 透明 度 ” 
为 25%， 效 果 如 图 16-4 所 示 。 

为 “图 层 1” 图 层 添加 一 个 图 层 蒙 版 ， 并 填充 黑色 ,隐藏 部 分 图 像 效 果 ， 如 
图 16-5 所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 光 带 psd” 素 材 图 像 ， 运 上 
景 图 像 编辑 窗 口中 的 合适 位 置 ， 效 果 如 图 16-6 所 示 。 


移动 工具 将 其 拖 虹 至 背 
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按 Ctrl+O 组 合 键 ， 打开“ 边框 . psd” 素材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 背 
景 图 像 编辑 窗口 中 的 合适 位 置 ， 如 图 16-7 所 示 。 ⁄ 


图 16-2 打开 素材 文件 图 16-3 拖 入 素材 图 像 
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16-6 ” 拖 入 素材 图 像 图 16-7 拖 入 素材 图 像 
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专家 指点 


在 选取 海报 广告 的 素材 时 ， 要 有 一 定 的 创意 ， 同 时 可 利用 这 些 装 饰 素材 作为 突破 口 ， 
直击 消费 者 的 核心 需求 。 


16.1.2 制作 海报 主体 效果 * | 


下 面 介 绍 制作 百货 诲 报 主 体 效 末 的 方法 。 

按 CtltO 组 合 键 ， 打 开 “ 礼 品 psd ”素材 图 像 ， 运 用 移动 工具 将 其 拖 上 息 至 背 
景 图 像 编辑 窗口 中 的 合适 位 置 ， 效 末 如 图 16-8 所 示 。 

按 CtrltO 组 合 键 ， 打 开 “ 伦 采 闭 饰 .psd ”素材 图 像 ， 运 用 移动 工具 将 其 拖 归 
至 背景 图 像 编辑 窗口 中 的 合适 位 置 ， 效 采 如 图 16-9 所 示 。 


图 16-8 拖 入 素材 图 像 图 16-9 拖 入 素材 图 像 


新 建 “ 图 层 6”, 在 图 层面 板 中 拖 蝶 至 “图 层 4” 下 方 , 前 景色 设置 为 黑色 (RGB 
参数 值 均 为 0)， 选 择 工具 箱 中 的 画笔 工具 ，“ 不 透明 度 ” 设 置 为 41%、“ 硬 度 ” 设 置 为 0%， 
在 图 像 编辑 窗口 涂抹 创建 阴影 效果 如 图 16-10 所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 写 字 psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 背 
景 图 像 编 辑 窗口 中 的 合适 位 置 ， 为 该 图 层 添加 图 层 蒙 版 ， 运 用 黑色 的 画笔 工具 在 图 像 上 涂抹 ， 
隐藏 部 分 图 像 ， 效 果 如 图 16-11 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 , 在 图 像 上 单 击 鼠 标 左 键 , 确定 插入 点 , 设置 “ 字 
体 ” 为 “ 华 康 海 报 体 ”、“ 字 体 大 小 ”为 20 点 、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 255)， 输 
入 相应 的 文字 ， 效 果 如 图 16-12 所 示 。 

选择 “端午 ”与 “优惠 ”文字 , 更 改 “ 字 体 大 小 ”为 38 点 , 并 将 文字 适当 旋转 角度 ， 
效果 如 图 16-13 所 示 。 
双击 文字 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “投影 ” 复 选 框 ， 设 置 “ 角 
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度 为 120 度 、 距离 为 7 像素 、 扩展 2 20%. 大 小 为 10 像 素 、 不 透明 度 
为 75%， 单 击 “ 人 确定 ”按钮 ， 为 文字 图 层 添 加 “投影 ”样式 ， 效 琳 如 图 16-14 所 示 。 

按 CtrltO 组 合 键 ,打开 “文字 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 忠 至 硼 
六 图 像 编 辑 窗 口中 的 合适 位 年 ， 效 未 如 图 16-15 所 示 。 


图 16-10 ”创建 阴影 图 16-11 拖 入 素材 图 像 
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图 16-12 输入 文字 图 16-13 调整 文字 角度 和 大 小 


, 1 


图 16-14 添加 图 层 样 式 16-15 最 终 效 果 
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16.2 摄影 书籍 推广 页 设计 


本 案例 是 一 个 天 猫 商场 的 摄影 书籍 推广 页 设计 ， 在 制作 的 过 程 中 使 用 简单 的 背景 图 片 进 
行 修饰 ， 添 加 “用 手机 如 何 拍 出 大 片 ”促销 方案 以 及 简单 的 广告 词 来 突出 产品 优势 。 

在 制作 天 猫 推广 页 设计 时 ， 先 运用 滤 镜 制作 出 有 纹理 效果 的 背景 ， 再 添加 相应 的 素材 与 
人 物 ， 最 后 加 上 适当 的 文字 即 可 完成 设计 。 

本 实例 最 终 效 果 如 图 16-16 所 示 。 
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图 16-16 ”实例 效果 


扫 一 扫 观看 在 线 视频 
摄 景 ?书籍 推广 由 设计 


16.2.1 制作 推广 页 主体 效果 OD| 

下 面 介绍 制作 推广 页 主体 效果 的 方法 。 

EZ 101 按 CtrltN 组 合 键 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设置 “名 称 ” 为 “摄影 书籍 推 
广 页面 设 计 ”、 “宽度 ”为 1920 像素 、“ 高 度 ” 为 1080 像素 、“ 分 辩 率 ”为 300 像素 /英寸 、“ 颜 
色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 如 图 16-17 所 示 ， 单 击 “ 创 建 ” 按 钮 ， 
新 建 一 个 空白 图 。 

展开 “图 层 ” 面 板 ， 新 建 “图 层 1” 图 层 ， 如 图 16-18 所 示 。 
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图 16-17 新 建 空白 文档 图 16-18 新 建 “ 图 层 1” 图 层 


设置 前 景色 为 浅 灰 色 (RGB 参数 值 均 为 217)， 为 “图 层 1” 图 层 填充 前 景色 ， 

如 图 16-19 所 示 。 

选择 “ 滤 镜 ”|“ 杂 色 ”| “添加 杂 色 ”命令 , 弹出 “添加 杂 色 ”对 话 框 , 设置 “数量 ” 
为 10%， 选 中 “高 斯 分 布 ” 单 选 按钮 和 “ 单 色 ” 复 选 框 ,， 单 击 “确定 ”按钮 ， 如 图 16-20 所 示 ， 
为 图 像 添 加 杂 色 。 
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填充 | 一 全 而 
- 平均 分 布 人 ) 铺设 = 
| 1 总 高 斯 分 布 (G] 


由 


图 16-19 JR 3%šBHU = t 图 16-20 ”设置 滤 镜 参数 


2 专家 指点 s  ) 


“ 杂 色 ”小 镜 添 加 或 移 去 杂 色 或 带 有 随机 分 布 色 阶 的 像素 ， 这 有 助 于 将 选区 混合 
到 周围 的 像素 中 ，“ 杂 色 ” 滤 镜 可 创建 与 众 不 同 的 纹理 或 移 去 有 问题 的 区 域 ， 如 灰 汪 
和 划 痕 。 
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AE CUB | 模糊 | 动感 模糊 命令， 弹出 “动感 模糊 ”对 话 框 ， 设 置 “ 角 
度 为 90 度 、 距离 为 2000 ze, 如 图 16-21 所 示 。 
单 击 “ 确 定 ” 按钮， 印 可 应 用 “动感 模糊 ” 兰 锐 ， 效 朱 如 图 16-22 所 示 。 


| 


图 16-21 设置 各 选项 图 16-22 应 用 滤 镜 


SE Fa 
“动感 模糊 ”可 以 根据 制作 效果 的 需要 江 指 定 方向 、 以 指定 强度 模糊 图 像 ， 该 对 话 
框 的 各 主要 选项 含义 如 下 。 


° “角度 ”: 用 来 设置 模 寡 的 方向 。 可 以 直接 输入 数值 ， 也 可 以 拖 动 指针 调整 角度 。 
° “距离 ”: 用 来 设置 像素 移动 的 距离 。 

选择 “ 滤 镜 ”|“ 滤 镜 库 ”命令 ， 打 开 滤 镜 库 ， 选 择 “ 调 色 刀 ” 滤 镜 ,设置 “ 描 
边 大 小 ”为 38、“ 描 边 细 节 ” 为 2、“ 软 化 度 ”为 3， 如 图 16-23 所 示 。 

单 击 “ 确 定 ” 按 钮 ， 即 可 应 用 “ 调 色 刀 ” 滤 镜 ， 效 果 如 图 16-24 所 示 。 
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图 16-23 设置 各 选项 图 16-24 应 用 滤 镜 
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天 猫 平台 : 
<<<<< 商场 广告 与 书籍 推广 页 设计 区 


选择 “图 像 ”|“ 调 整 ”|“ 曲 线 ” 命 令 ， 弹 出 “曲线 ”对 话 框 ， 在 曲线 上 单 击 
鼠标 左 键 新 建 一 个 控制 点 ， 在 下 方 设 置 “输入 ”为 95、“ 输 出 ”为 146， 如 图 16-25 所 示 。 
单 击 “确定 ”按钮 ， 调 整 图 像 亮 度 ， 效 果 如 图 16-26 所 示 。 
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通道 县 加 (WV) 预览 [P) 
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图 16-25 设置 各 选项 图 16-26 JH =E 


“曲线 ”命令 调节 曲线 的 方式 ， 可 以 对 图 像 的 亮 调 、 中 间 调 和 有 瞳 调 进行 适当 调整 ， 
而 且 只 对 某 一 范围 的 图 像 进行 色调 的 调整 ， 它 相 较 于 “ 色 阶 ， ， 可 以 通过 在 曲线 上 添加 
多 个 控制 点 的 方式 ， 更 加 精准 地 调节 图 像 亮度 。 


按 Ctrl+O 组 合 键 打开 “三 角形 psd” 素材 图 像 ， 运 用 移动 工具 将 素材 图 像 
拖 蝶 至 背景 图 像 编辑 窗口 中 ,适当 调整 图 像 的 位 置 ， 效 琳 如 图 16-27 所 示 。 

按 CtrltO 组 合 键 ,打开 “讲师 psd ”素材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
忠 至 育 景 图 像 编 辑 窗 口中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 16-28 所 示 。 


< J P| 
a asi 
P < 
`` DV 
图 16-27 拖 忠 图 像 图 16-28 拖 忠 图 像 
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16.2.2 制作 推广 页 文字 效果 JU 


下 面 介 绍 制 作 推广 页 文字 效果 的 方法 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “Adobe 
黑体 Std”、“ 字 体 大 小 ”为 24 点 、“ 行 距 ” 为 30 点 、“ 字 体 上 颜色” 为 蓝 色 (RGB 参数 值 分 
别 为 22、118、255)， 如 图 16-29 所 示 。 

在 图 像 编辑 窗口 中 输入 文字 ， 移 至 合适 位 置 ， 效 果 如 图 16-30 所 示 。 


< 2 
摄影 高 手 养 成 系列 aí 
著名 作家 构图 君 编著 ~ 
输入 Á 
` 
图 16-29 ”设置 各 选项 图 16-30 输入 文字 


03 选取 工具 箱 中 的 直线 工具 , 在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “形状 ”、 
“填充 ” x. (RGB 参数 值 分 别 为 22、118、255)、“ 粗 细 ” 为 15 像素 ， 绘 制 一 个 直线 形状 ， 
效果 如 图 16-31 所 示 。 
双击 “形状 1” 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “投影 ” 复 选 框 ， 设 置 

“角度 ”为 90 度 、“ 距 离 ”为 14 像 素 、 扩展 ”为 4%、 “大 小 为 24 像 素 、“ 不 透明 度 
为 46%， 单 击 “确定 ”按钮 ， 为 形状 图 层 添 加 “投影 ”样式 ， 效 果 如 图 16-32 所 示 。 


摄影 高 手 养 成 系列 <a 


摄影 高 手 养 成 系列 呆 j“ 
、 ZJ 车 名 作家 构图 君 编著 ~ 


、 过] 著名 作家 构图 君 编著 ~ 


图 16-31 绘制 直线 图 16-32 添加 图 层 样式 


05| 选取 工具 箱 中 的 横 排 文 字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
a 、“ 字 体 大 小 ”为 16 点 、“ 行 距 ” 为 8、“ 字 体 颜 色 ” 为 蓝 色 RGB 参数 值 
分 别 为 22、118、255)， 在 图 像 编辑 窗口 中 输入 文字 ， 效 果 如 图 16-33 所 示 。 
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按 Ctrl+O 组 合 键 ， 打 开 “ 书 籍 1psd” 素 材 图 像 ， 如 图 16-34 所 示 


二 Á 
“| 摄影 高 手 养 成 系列 < 
、 过 著名 作家 构图 君 编著 ~ 


j E S < 12% JR #n 4el 
N Ñ j; 用 手机 拍 出 大 片 多 
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图 16-33 输入 文字 图 16-34 打开 书 厌 素 材 


选择 “图 像 ”|“ 调 整 ”|“ 曲 线 ” 命 令 ， 弹出“ 曲线” 对话 框 ， 在 曲线 上 单 击 
鼠标 左 键 新 建 一 个 控制 点 ， 在 下 方 设置 “输入 ”为 106、“ 输 出 ”为 185， 如 图 16-35 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 应 用 效果 如 图 16-36 所 示 。 
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图 16-35 设置 各 选项 图 16-36 ”调整 亮度 
运用 移动 工具 将 其 拖 归 至 背景 图 像 编 辑 窗口 中 的 合适 位 置 ， 适 当地 调整 大 小 ， 
效果 如 图 16-37 所 示 。 
按 Ctrl+O 组 合 键 ， 打 开 “ 书 籍 2psd” 素 材 图 像 ， 如 图 16-38 所 示 。 
选择 “图 像 ”|“ 调 整 ”|“ 曲 线 ” 命 令 ， 弹 出 “曲线 ”对 话 框 ， 在 曲线 上 单 击 
忌 标 左 键 新 建 一 个 控制 点 ， 在 下 方 设 置 “ 输 入 ”为 106、“ 输 出 ”为 185， 单 击 “ 确 定 ” 按 锂 
应 用 效果 如 图 16-39 所 示 。 
1 112 运用 移动 工具 将 其 拖 电 至 背景 图 像 编辑 窗口 中 的 合适 位 置 ， 适 当地 调整 大 小 ， 
效果 如 图 16-40 所 示 。 
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图 16-38 打开 素材 图 像 


有 
摄影 高 手 养 成 系列 大 
著名 作家 构图 君 编著 ~ 


摄影 大 咖 教 你 如 何 
用 手机 拍 出 大 片 | 


图 16-39 ”调整 亮度 图 16-40 ” 拖 中 图像 


236 I 


知识 导读 


微 商 店铺 的 应 用 领域 在 逐步 扩大 ， 应 用 形式 也 越 来 越 广泛 ， 并 深入 到 生活 
中 的 各 个 方面 。 因 此 ， 本 章 将 重点 讲解 如 何 设计 自己 的 微 商 店铺 ， 使 店铺 在 炊 
多 的 微 商 店铺 中 表现 出 自己 独 有 的 特色 。 


本 章 重 点 导航 
O 美食 微 店 广告 设计 
O 数码 产品 广告 设计 
© 图 书 微 店 界面 设计 
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s 完全 操作 手册 


17.1 美食 微 店 广告 设计 


在 进行 美食 微 店 广告 设计 时 ， 应 体现 食物 具有 诱惑 力 的 原则 。 本 实例 讲解 如 何 通 过 添加 
产品 素材 ， 变 换 图 像 、 添 加 文字 等 技巧 ， 增 强 美 食 微 店 的 宣传 广告 效 采 。 
本 实例 最 终 效 果 如 图 17-1 所 示 。 
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图 17-1 实例 效果 


扫 一 扫 观 看 在 线 视频 
美食 微 店 广告 设计 


17.1.1 店 招 主体 制作 效果 DD 


在 进行 店 招 设计 时 ， 运 用 滤 镜 制作 的 背景 图 像 ， 加 上 适当 的 文字 ， 可 使 整个 画面 显得 更 


按 CtrlHN 组 合 键 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设置“ 名称” 为 “美食 微 店 广 
告 设计 ”、“ 宽 度 ” 为 1080 像素 、“ 高 度 ” 为 1400 像素 、“ 分 辩 率 ”为 300 像素 /英寸 、“ 颜 
色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 如 图 17-2 所 示 ， 单 击 “ 创 建 ” 按 钮 ， 
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CAS 


新 建 一 个 空白 图 像 。 
按 Ctrl+O 组 合 键 ， 打 开 “ 店 招 背 景 jpg” 素 材 图 像 ， 如 图 17-3 所 示 。 
选择 “窗口 ”|“ 调 整 ”命令 ， 打 开 “ 调 整 ”面板 ， 在 “调整 ”面板 中 单 击 “ 亮 
度 / 对比度 ”按钮 ， 如 图 17-4 所 示 。 


图 17-3 素材 图 像 


新 建 “亮度 /对比度 1” 调 整 图 层 ， 在 展开 的 “属性 ”面板 中 设置 “亮度 ”为 


35、 对比度 ”为 21， 如 图 17-5 所 示 。 
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图 17-4 šh “ER 对比度 ”按钮 图 17-9 设置 参数 


在 “调整 ”面板 中 单 击 “自然 饱和 度 ” 按 钮 ， 新 建 “ 自 然 饱 和 度 1” 调 整 图 层 ， 
在 “属性 ”面板 中 设置 “自然 饱和 度 ” 为 50， 效 果 如 图 17-6 所 示 。 
Ez Shift+CtrlHAltrE 组 合 键 , 盖 印 可 见 图 层 , 得 到 “图 层 1” 图 层 , 如 图 17-7 所 示 。 
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图 17-6 图 像 效果 图 17-7 得 到 “图 层 1” 图 层 


执行 “小 税 ” |“ 像素 化 ”|“ 彩 块 化 ”命令 ， 将 图 像 转化 为 小 的 彩 块 ， 效 果 如 
图 17-8 所 示 。 

选择 “ 滤 镜 ”|“ 模 糊 ” 命 令 , 弹出 “高 斯 模糊 ”对 话 框 ，“ 半 人 径 ” 设 置 为 5 像素 ， 
如 图 17-9 所 示 。 


图 17-8 将 图 像 转化 为 小 的 彩 块 图 17-9 设置 半径 


单 击 “确定 ”按钮 ， 即 可 应 用 “模糊 滤 镜 ， 制 作出 模糊 的 育 景 ， 效 朱 如 
图 17-10 所 示 。 

步骤 运用 移动 工具 将 素材 图 像 拖 暇 至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 大 小 和 
位 置 ， 效 果 如 图 17-11 所 示 。 
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17-10 应 用 “模糊 ” 滤 镜 17-11 拖 忠 并 调整 图 像 


滤 镜 是 一 种 桂 件 模块 ， 能 够 对 图 像 中 的 像素 进行 操作 ， 也 可 以 模拟 一 些 特殊 的 光照 
效果 或 带 有 装饰 性 的 纹理 效果 。Photoshop 提供 了 多 种 滤 镜 ,使 用 这 些 滤 镜 ， 用户 无 需 耗 
资 大 量 的 时 间 和 精力 就 可 以 快速 制作 出 云彩 、 马 赛 克 、 模 糊 、 素 描 、 光 照 以 及 各 种 捏 曲 
歼 采 。 

滤 镜 是 Photoshop 的 重要 组 成 部 分 它 就 像 是 一 个 魔术 师 。 很 难 想 象 ， 如果 没有 滤 镜 ， 
Photoshop 是 否 会 成 为 图 像 处 理 领域 的 领先 软件 。 因 此 滤 镜 对 于 每 一 个 使 用 Photoshop 的 
用 户 而 言 ， 痢 具有 很 重要 的 意义 。 滤 镜 可 能 是 作品 的 润色 剂 ， 也 可 能 是 作品 的 腐蚀 剂 ， 
到 底 扮 溪 什 么 角色 ， 取 决 于 操作 者 如 何 正 确 使 用 滤 镜 。 


选取 工具 箱 中 的 矩形 选 框 工具 ， 在 图 像 编 辑 窗口 中 的 适当 位 置 绘制 一 个 矩形 选 
框 ， 如 图 17-12 所 示 ， 设 置 前 景色 为 白色 (RGB 参数 值 均 为 255)。 

新 建 一 个 图 层 ， 为 选区 填充 白色 并 取消 选区 ， 设 置 图 层 的 “不 透明 度 ” 为 
76%， 效 果 如 图 17-13 所 示 。 


图 17-12 绘制 矩形 选 杠 图 17-13 填充 白色 
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17.1.2 店 招 字体 制作 效果 | 

下 面 详细 介绍 店 招 字体 制作 效果 的 方法 。 

选取 工具 箱 中 的 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 无 、“ 描 边 ” 为 白 
色 (RGB 参数 值 均 为 255)、“ 描 边 宽度 ”为 15 像素 ， 在 图 像 编 辑 窗口 中 的 适当 位 置 绘制 一 个 
和 矩形 图 形 ， 设 置 “ 不 透明 度 ” 为 80%， 如 图 17-14 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 , 在 “字符 ”面板 中 设置 “字体 系列 ”为 “Adobe 
黑体 std”、“ 字 体 大 小 ”为 18 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 75、“ 颜 色 ” 为 棕色 (RGB 
参数 值 分 别 为 160、117、41), 并 激活 仿 粗 体 图 标 , 在 图 像 编 辑 窗口 中 输入 文字 , 如 图 17-15 所 示 。 


图 17-14 绘制 矩形 图 形 17-15 输入 文字 


复制 刚刚 输入 的 文字 , 移 至 合适 位 置 , 在 “字符 ”面板 中 设置 “大 小 ”为 11 点 、 
“设置 所 选 字符 的 字 距 调整 ”为 5、“ 颜 色 ” 为 咖啡 色 (RGB 参数 值 分 别 为 155、85、24)， 
并 修改 文字 内 容 ， 如 图 17-16 所 示 。 
选取 工具 箱 中 的 矩形 工具 ,在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “形状 ”、 
“填充 ”为 白色 (RGB 参数 值 均 为 255)、“ 描 边 ”为 灰色 (RGB 参数 值 均 为 83)、“ 描 边 宽度 ” 
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图 17-16 修改 文字 内 容 图 17-17 绘制 矩形 
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项 的 设置 ， 也 可 以 设置 矩形 的 尺寸 、 固 定 宽 高 比例 等 。 
按 Ctrl+O 组 合 键 ， 打 开 “ 标 志 按 钮 素材 .psd” 素 材 图 像 ， 运 用 移动 工具 将 素 
WU UP oSesesa sisa 适当 调整 图 像 的 位 置 ， 效 果 如 图 17-18 所 示 。 
06 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
其 黑 一 简体 ? “字体 大 小 ”为 15 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -50、“ 颜 色 ” 为 深 
灰色 (RGB 参数 值 均 为 30)， 在 图 像 编 辑 窗口 中 输入 文字 ， 如 图 17-19 所 示 。 


ESE TA PS 3⁄2 j 


”当天 制作 绝对 新 鲜 100% 


图 17-18 Rs Edi 17-19 输入 文字 


复制 刚刚 输入 的 文字 ， 移 动 至 合适 位 置 ， 在 “字符 ”面板 中 设置 “字体 大 小 ” 
为 11 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -100、“ 颜 色 ” 为 灰色 (RGB 参数 值 均 为 153), 
Es 如 图 17-20 所 示 。 
08| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
细 黑 简体 ”、 “字体 大 小 ”为 10 点 、“ 行 距 ” 为 11 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -100、 
“颜色 ”为 灰色 (RGB 参数 值 均 为 100)， 在 图 像 编辑 窗口 中 输入 文字 ， 如 图 17-21 所 示 。 


微 店 装修 要 把 握 一 个 度 ， 能 用 表格 和 字体 的 加 粗 以 及 颜色 解决 的 问题 ， 尽 量 不 要 用 
图 片 ， 这 样 你 的 店 的 访问 速度 就 会 完全 不 受 影 响 了 。 

店铺 装修 得 漂亮 ， 确 实 能 更 多 地 吸引 买 家 的 眼球 ， 但 我 们 要 清楚 一 点 ， 店 铺 的 装饰 
别 抢 了 商品 的 风头 ， 毕 竞 我 们 是 为 了 卖 产 品 而 不 是 郁 店 铺 ， 弄 得 太 多 太 乱 反而 会 喧 窒 
村 主 。 
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图 17-20 修改 文本 内 容 17-21 输入 文字 


选中 除 “ 背 景 ” 图 层 外 的 所 有 图 层 ， 按 Ctrlt+G 组 合 键 ， 为 图 层 编 组 ， 得 到 
组 1” 图 层 组 ， 如 图 17-22 所 示 。 

按 Ctrl+O 组 合 键 , 打开 “ 微 店 界面 1.jpg 素材 图 像 ,， 切换 至 背景 图 像 编辑 窗口 ， 
运用 移动 工具 将 图 层 组 的 图 像 拖 中 至 刚 打 开 的 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 
如 图 17-23 所 示 。 


“x 
EE | 通道 me = 
Diam vv BE Q T I n ee 
sP Y| 剧 亚 明度 : 100% ~ 
iWkE: EB ww 中 本 自 填充 :|100% Ç 


堆 衣 上 天 都 是 当 丢 制作 当 壬 改 货 哮 
| 店铺 动态 | 
= S L L r 5 
图 17-22 得 到 “H 1” 图 层 组 图 17-23 ” 拖 忠 并 调整 图 像 


17.2 数码 产品 广告 设计 


在 设计 数码 产品 宣传 广告 时 ， 应 体现 通俗 化 、 大 众 化 的 原则 。 本 实例 通过 添加 产品 素材 ， 
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变换 图 像 、 添 加 文字 和 应 用 图 层 样 式 等 技巧 增强 了 单反 相机 数码 产品 的 宣传 广告 效果 。 
本 实例 最 终 效 果 如 图 17-24 所 示 。 
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图 17-24 实例 效果 


扫 一 扫 观 看 在 线 视频 . 
数码 产品 广告 设 寺 


17.2.1 制作 数码 产品 广告 主体 效果 

下 面 详细 介绍 制作 数码 产品 广告 主体 效果 的 方法 。 

EZ.]01 按 CtltO 组 合 键 ， 打开 一 幅 素 材 图 像 ， 如 图 17-25 所 示 。 

新 建 “ 亮 度 / 对比度 1” 调整 图 层 ， 展 开 “ 属 性 ”面板 ， 设 置 “亮度 ”为 42， 
提高 图 像 亮度 ， 效 果 如 图 17-26 所 示 。 


S 2 Fa 


不 同 的 店铺 色调 ,会 给 顾客 不 一 样 的 感觉 合适 的 店铺 色彩 不 但 可 以 激发 顾客 的 购 
买 欲 ， 同 时 可 以 提高 商品 的 水 准 ， 店 主 应 该 如 何 选择 主 色 调 呢 ? 

一 般 来 说 ， 暖 色 系 是 很 容易 亲近 的 色 系 ， 例 如 红 、 黄 等 色 ， 这 上 比较 适合 年 轻 阶层 光顾 
的 店铺 ; 同色 系 中 ， 粉红、 鲜红 、 鹅 黄色 等 是 女性 音 好 的 色彩 ,适合 妇女 用 品 店 及 婴 幼 儿 
服饰 店 等 产品 华丽 的 高 级 店铺 ; 冷色 系 有 问 庄 肃穆 的 感觉 适合 高 档 商务 男装 店铺 使 用 。 
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图 17-25 打开 素材 图 像 


如 图 17-27 所 示 。 
单 击 “确定 ”按钮 ， 即 可 应 用 “模糊 ” 滤 镜 ， 制 作出 模糊 的 背景 ， 效 果 如 
17-28 所 示 。 
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图 17-27 设置 滤 镜 参数 1⁄-28 ”应 用 滤 镜 


按 Ctrl+O 组 合 键 ， 打开 “手机 .psd” 素 材 图 像 ， 如 图 17-29 所 示 。 
TE 06| 运用 移动 工具 将 素材 图 像 拖 忠 至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 
如 图 17-30 所 示 。 

双击 “图 层 1 拷贝 ”图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “投影 ” 复 选 框 ， 
设置 投影 颜色 为 党 色 (RGB 值 均 为 233)， 各 选项 设置 如 图 17-31 所 示 。 
单 击 “确定 ”按钮 ， 应 用 图 层 样 式 ， 效 果 如 图 17-32 所 示 。 
在 “图 层面 板 ” 中 ， 新 建 “ 图 层 2” 图 层 ， 如 图 17-33 所 示 。 
选择 工具 箱 中 的 画笔 工具 , 在 工具 属性 栏 中 设置 “画笔 大 小 ”为 70 像素、“ 硬 
JE” 为 0%、“ 不 透明 度 ” 为 41%， 在 手机 的 下 方 涂抹 添加 叶 色 的 阴影 ， 效 果 如 图 17-34 所 示 。 
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图 17-<9 打开 素材 
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图 17-31 设置 各 项 参数 
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图 17-33 新 建 “ 图 层 2” 图 层 
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图 17-30 ” 拖 忠 素材 


图 1/-32 应 用 图 层 样式 


图 17-34 创建 阴影 
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按 图 层 面板 中 的 排列 次 序 ， 自 上 而 下 进行 合 加 ， 最 上 层 的 图 像 人 让 住 下 层 同 一 位 置 的 
图 像 ， 而 在 其 远 明 区 域 则 可 以 看 到 下 层 的 图 像 ， 最 终 通过 登 加 得 到 完整 的 图 像 。 


17.2.2 ”制作 数码 产品 广告 文字 效果 \) 


下 面 介 绍 制作 数码 产品 广告 文字 效果 的 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 文 字 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 拖 
眼 至 背景 图 像 编辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 17-35 所 示 。 

选取 工具 箱 中 的 椭圆 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 红色 (RGB 参数 
值 分 别 为 255、0、0)、“ 描 边 ” 为 无 ， 按 Shift 键 在 图 像 编辑 窗口 中 绘制 一 个 正 圆 形 ， 如 
图 17-36 所 示 。 
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图 17-35 ”打开 文字 素材 图 17-36 ”绘制 正 圆 图 形 
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网 上 做 买卖 ,最 主要 的 是 如 何 把 自己 的 商品 信息 准确 地 传递 给 顾客 ， 让 顾客 光顾 自 
己 的 店铺 。 图 片 传 递 的 只 是 商品 的 样式 和 颜色 的 信息 ， 对 于 性 能 、 材 料 、 信 后 服务 ,天 
家 一 概 不 知 ， 所 以 这 些 门 容 需 要 通过 文字 的 描述 来 告诉 买 家 。 


选取 工具 箱 中 的 横 排 文字 工具 ,在 “字符 ”面板 中 设置 “字体 系列 ”为 “Adobe 
黑体 Std4”、“ 字 体 大 小 ”为 8 点 、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 255)， 如 图 17-37 所 示 。 
在 图 像 编辑 窗口 中 输入 文字 ， 效 果 如 图 17-38 所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 充 电 宝 psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 像 


拖 虹 至 背景 图 像 编辑 窗 口中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 17-39 所 示 。 
选取 工具 箱 中 的 圆 角 和 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 红色 (RGB £ 
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数值 分 别 为 235、0、0)、“ 描 边 ” 为 无 、“ 半 径 ” 为 10 像素 ， 在 图 像 编 辑 窗 口中 绘制 一 
圆 角 算 形 ， 如 图 1 /-40 所 示 。 
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图 17-37 设置 字符 面板 图 17-38 输入 文字 
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图 17-39 ” 拖 忠 素材 图 17-40 绘制 圆 角 和 矩形 


双击 “ 贺 角 矩形 1 图 层 , 弹出 “图 层 样 式 ” 对 话 框 , 选中 “投影 复 选 框 ，“ 投 
影 ” 闫 色 设 置 为 于 色 (RGB 参数 值 均 为 0)， 各 选项 设置 如 图 17-41 所 示 。 
单 击 “ 确 定 按钮 ， 应 用 图 层 梓 式 ， 效 琳 如 图 17-42 所 示 。 
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图 17-41 设置 “ 描 边 ”参数 图 17-42 应 用 图 层 样 式 
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选取 工具 箱 中 的 横 排 文字 工具 ,在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 细 黑 一 
简体 ”、“ 字 体 大 小 ”为 7.5 点 、“ 颜 色 ” 为 白色 (RGB 参数 值 均 为 255)、“ 行 距 ” 为 8.2 点 、 
“设置 所 选 字符 的 字 距 调整 ”为 -100， 激 活 仿 粗 体 图 标 ， 如 图 17-43 所 示 。 

在 图 像 编辑 窗口 中 输入 文字 ， 效 果 如 图 17-44 所 示 。 
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图 17-43 设置 “字符 ”面板 图 17-44 输入 文字 


17.3 Eloise Bls: YT 


在 制作 图 书 微 店 界面 时 ， 首 先 制作 出 顶部 的 横幅 广告 ， 再 用 多 张 精 美 的 图 片 制作 出 展示 
区 ， 并 添上 说 明 性 文字 ， 即 可 完成 设计 。 
本 实例 最 终 效 果 如 图 17-45 所 示 。 


店铺 首页 全 部 商品 新 品 上 架 店铺 首页 全 部 商品 新 品 上 架 


1 摄影 手法 


《旅游 摄影 高 手 新 玩法 》 。 《手机 摄影 高 手 新 玩法 》 
© 


《旅游 摄影 高 手 新 玩法 》 ”《 手 机 摄影 高 手 新 玩法 》 宝贝 分 类 


图 17-45 ”实例 效果 
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17.3. 制作 微 店 横幅 广告 效果 | 

下 面 详细 介绍 制作 微 店 横幅 广告 效果 的 方法 。 

选择 “文件 ”|“ 新 建 ” 命 令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设置 各 选项 如 
17-46 所 示 ， 单 击 “ 创 建 ”按钮 ， 新 建 一 个 空白 图 像 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 横 幅 广告 背景 jpg” 素 材 图 像 ， 运 用 移动 工具 将 素 
材 图 像 拖 上 至 背景 图 像 编辑 窗口 中 ， 适 当 调整 图 像 的 位 置 ， 效 果 如 图 17-47 所 示 。 


| 


图 17-46 ”新建 空白 图 像 图 17-47 Fe El X: 


选取 工具 箱 中 的 槛 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 
大 寻 人 简体 ”、“ 字 体 大 小 ”为 50 点 、“ 颜 色 ” 为 线 监 色 (RGB 参数 值 分 别 为 0、114、255)， 
在 图 像 编 辑 窗口 中 输入 文字 ， 如 图 17-48 所 示 。 
在 “图 层 1” 图 层 上 方 新 建 一 个 图 层 ， 选 取 椭 圆 选 框 工具 ， 在 工具 属性 栏 中 设 
置 “ 羽 化 ”为 10 像素 ， 在 图 像 编辑 窗口 中 绘制 一 个 椭圆 选 框 ， 效 果 如 图 17-49 所 示 。 
设置 前 景色 为 黄色 (RGB 参数 值 分 别 为 221、173、84)， 为 选区 填充 前 景色 并 
取 清 选区 ， 效 霖 如 图 17-50 所 示 。 
按 CtrltO 组 合 键 ， 打开“ 微 店 装饰 psd ”素材 图 像 ， 运 用 移动 工具 将 素材 
像 拖 忠 至 背景 图 像 编 辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 17-51 所 示 。 
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图 17-49 ”绘制 椭圆 选 框 
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图 17-51 Fena ss 44 


图 17-50 取消 选区 


17.3.2 制作 店铺 商品 展示 效果 * | 


下 面 详细 介绍 制作 店铺 商品 展示 效果 的 方法 。 
选取 工具 箱 中 的 矩形 工具 ， 设 置 “ 填 充 ” 为 浅 灰 色 (RGB 参数 值 均 为 238)， 给 
制 一 个 矩形 图 形 ， 效 果 如 图 17-52 所 示 。 
选取 工具 箱 中 的 横 排 文字 工具 ,在 “字符 ?面板 中 设置 “字体 系列 ?为 “微软 雅 黑 ”、 
“字体 大 小 ”为 30 点 、“ 颜 色 ” 为 黑色 , 在 图 像 编辑 窗口 中 输入 文字 , 效果 如 图 17-53 所 示 。 


—  IN252 


| 
T TIT TI Tr T' T, T = 
ñ e #t “mq ua T Bi 5 
谣 国 葛 语 “` 3 ~ 


图 17-52 ”绘制 矩形 17-53 输入 文本 


S 2 Fa 


微 店 想 要 吸引 顾客 ， 必 须 从 店铺 装修 入 手 ， 优 化 店铺 界面 。 漂 亮 的 店铺 可 以 让 买 家 
在 购物 的 同时 ， 享 受精 美的 界面 带 来 的 愉悦 感 ; 同时 让 买 家 较 长 时 间 地 停留 在 店铺 ， 增 
加 购买 的 可 能 性 ， 打 造 销量 猛 增 的 微 店 旺 铺 。 


n 303] 运用 横 排 文字 工具 选择 “店铺 首页 ”文字 ， 在 “字符 ”面板 中 设置 “颜色 ”为 
红色 (RGB 参数 值 分 别 为 235、35、35),， 效果 如 图 17-54 所 示 。 

选取 工具 箱 中 的 直线 工具 ， 设 置 “填充 ”为 红色 (RGB 参数 值 分 别 为 235、 
35、35)、“ 粗 细 ” 为 3 像素 ， 绘 制 一 条 直线 图 形 ， 效 果 如 图 17-55 所 示 。 


图 1/-54 ”调整 文字 颜色 17-55 绘制 直线 
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选取 工具 箱 中 的 直线 工具 ， 设 置 “填充 ”为 红色 (RGB 参数 值 分 别 为 235、 
35. 35). “HAH 为 8 像素 ， 绘 制 一 条 坚 直 的 直线 图 形 ， 效 末 如 图 17-56 所 示 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 商 品 展示 区 psd” 素 材 图 像 ， 运 用 移动 工具 六 
图 像 拖 电 至 背景 图 像 编 辑 窗口 中 ， 适 当 调 整 图 像 的 位 置 ， 效 果 如 图 17-57 所 示 。 


全 部 商品 


《旅游 摄影 高 手 新 玩法 》 《手机 摄影 高 手 新 玩法 》 


图 17-56 ”绘制 直线 图 17-57 拖 忠 商品 素材 
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随 着 新 嫁 体 和 内 容 营销 的 迅速 崛起 ， 如 何在 电 商 运 营 中 利用 视 竞 营销 提高 
品牌 、 店 铺 和 产品 的 知名 度 井 创造 利润 ?9 这 一 点 是 微 商 朋 友 圈 运营 者 天 注 的 重 
各 ， 也 是 难点 。 本 章 主要 介绍 电 商 平台 的 新 媒体 美工 设计 案例 。 


本 章 重点 导航 


@ 潮流 休闲 鞋 广告 设计 
@ 珠宝 首饰 产品 广告 设计 
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18.1 泣 流 休闲 畦 广告 设计 


本 案例 是 针对 微 商 朋友 圈 平 台 设计 的 休闲 鞋 广 告 ， 在 制作 的 过 程 中 使 用 充满 活力 感 的 强 
对 比 色 背 景 图 片 进行 修饰 ， 添 加 促销 方案 以 及 简单 的 广告 词 来 突出 产品 优势 。 
本 实例 最 终 效 果 如 图 18-1 所 示 。 
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舒适 轻便 新 品 上 市 


威 匡 1974X 系 列 2229 
[潮流 休闲 鞋 ] Z sag 
s= 263 


1 分 钟 前 删除 


图 18-1 实例 效果 
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18.1.1 制作 微 丙 朋友 圈 广 告 背 景 效果 JW 


下 面 主要 通过 运用 裁剪 工具 、“ 亮 度 /对 比 度 ”命令 来 制作 微 商 朋 友 圈 广告 的 背景 效果 。 

按 Cal+O 组 合 键 ， 打 开 一 幅 素材 图 像 ， 如 图 18-2 所 示 。 

在 工具 箱 中 ， 选 取 裁 剪 工 具 ， 如 图 18-3 所 示 。 

在 工具 属性 栏 中 的 “选择 预 设 长 宽 比 或 裁剪 尺寸 ”列表 框 中 选择 “1 : 1( 方 形 ) 
选项 ， 如 图 18-4 所 示 。 


执行 操作 后 ， 在 图 像 中 会 显示 1 : 1 的 方形 裁剪 框 ， 如 图 18-5 所 示 。 

调整 裁剪 的 区 域 ， 按 Enter 键 确认 裁剪 图 像 ， 如 图 18-6 所 示 。 

选择 “图 像 ”|“ 调 整 ”|“ 亮 度 / 对比度 ”命令 ， 弹 出 “亮度 /对比度 ”对 话 框 ， 
设置 “亮度 ”为 10、“ 对 比 度 ” 为 1535， 单 击 “确定 ”按钮 ， 即 可 增强 主 图 背景 的 对 比 效 末 ， 
效果 如 图 18-7 所 示 。 
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图 18-2 打开 素材 图 像 
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1024 x 768 像素 92 ppi 
1280 x 800 [@ 3 113 ppi 
1366 x 768 JEE 135 ppi 
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图 18-4 选择 “1 : 1( 方 形 )” 选 项 图 18-5 “显示 方形 裁剪 杠 
图 18-6 “确认 裁剪 图 像 图 18-7 ”增强 主 图 背景 的 对 比 效果 


18.1.2 制作 微 商 朋友 圈 广 告 商品 效果 
下 面 主要 运用 移动 工具 、 复 制图 层 、 魔 棒 工 具 、 旋 转 命令 等 ， 制 作 帆 布鞋 网 店主 图 的 商 
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品 图 像 效 果 。 
按 Ctrl+O 组 合 键 ， 打 开 一 幅 商品 素材 图 像 ， 如 图 18-8 所 示 。 
去 河 02| E Ctrl+J 组 合 键 ， 复 制 一 个 新 图 层 ， 隐 藏 “背景 ”图 层 ， 如 图 18-9 所 示 。 
在 工具 箱 中 ， 选 取 魔 棒 工 具 ， 在 工具 属性 栏 中 设置 “ 容 差 ”为 6， 在 图 像 的 白 
色 区 域 单 击 鼠 标 左 键 ， 即 可 创建 选区 ， 如 图 18-10 所 示 。 
按 Delete 键 ， 删 除 选区 内 的 部 分 图 像 ， 去 除 白色 背景 图 像 ， 如 图 18-11 所 示 。 
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图 18-8 打开 素材 图 像 图 18-9 复制 一 个 新 图 层 


图 18-10 创建 选区 图 18-11 删除 选区 


先 取 消 选 区 ， 然 后 在 工具 箱 中 ， 选 取 移 动工 具 ， 将 抠 取 的 鞋子 图 像 拖 电 至 背景 
图 像 的 编辑 窗口 中 ， 如 图 18-12 所 示 。 

按 CaHT 组 合 键 ， 调 出 变换 控制 框 ， 适 当地 调整 图 像 的 大 小 和 位 置 ， 如 
图 18-13 所 示 。 
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图 18-12 ” 拖 电 图 像 18-13 ”调整 图 像 


18.1.3 制作 微 丙 朋 友 圈 广告 文案 效果 


下 面 介 绍 制 作 微 商 朋友 圈 广 告 文案 效果 的 方法 。 

在 “图 层 ” 面 板 下 方 ， 单 击 “ 创 建新 图 层 ” 按 钮 ， 新 建 “ 图 层 2” 图 层 ， 如 
18-14 所 示 。 

在 工具 箱 中 选取 和 矩形 工具 ， 在 工具 属性 栏 中 设置 “ 拾 色 器 (填充 颜色 )” 为 绿 
色 (RGB 参数 值 分 别 为 0、153、68)， 如 图 18-15 所 示 。 
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18-14 新建“ 图 层 2” 图 层 图 18-15 设置 填充 颜色 


在 黄色 背景 部 分 的 合适 位 置 ， 绘 制 一 个 矩形 图 像 ， 如 图 18-16 所 示 。 
在 “图 层 ” 面板 中 , 使 用 鼠标 左 键 双 击 “ 上 矩形 1” 图 层 , 弹出 “图 层 样式 ”对 话 框 ， 


2509. u. 


ms U 


新 媒体 美工 Nm >>>> 
i 完全 操作 手册 


选中 “投影 ” 复 选 框 ， 设 首 “ 不 透明 度 ” 为 29%、“ 距 离 ” 为 3 像素 、“ 大 小 ”为 3 像素 ， 
如 图 18-17 所 示 ， 


图 18-16 ”绘制 和 矩形 图 18-17 设置 参数 


.05| 单 击 “ 确 定 ” 按 钮 ， 即 可 为 矩形 添加 投影 效果 ， 如 图 18-18 所 示 。 
06| 在 工具 箱 中 选取 横 排 文字 工具 , 设置 “字体 ”为 “黑体 ”、“ 字 体 大 小 ”为 5 点 、 
sie” 为 日 色 (RGB 参数 值 均 为 255)， 激 活 仿 粗 体 图 标 ， 如 图 18-19 所 示 。 


| 黑体 v V 
aT 5 点 ~| r (Bš) 
VA o VA 


图 18-18 ”添加 投影 效果 图 18-19 设置 参数 


专家 指点 


正确 地 对 图 层 样 式 进行 操作 ， 可 以 使 用 户 在 工作 中 更 方便 地 查看 和 管理 图 层 样 式 ，。 
隐藏 图 技 样 式 后 ， 可 以 暂时 将 图 层 样 式 进行 清除 ， 也 可 以 重新 显示 。 而 删除 图 层 样 式 ， 
则 是 将 图 技 中 的 图 层 样式 进行 彻底 清除 ， 无 法 还 原 。 


输入 相应 的 文字 ， 按 Ctrlt+Enter 组 合 键 确 认输 入 ， 切 换 至 移动 工具 ， 根 据 需要 
ee 效果 如 图 18-20 Ws 
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体 ”、“ 字 体 大 小 ”为 12 点 、“ 颜 色 ” 为 黑色 (RGB 参数 值 均 为 0)， 激 活 仿 粗 体 图 标 ， 如 
18-21 所 示 。 
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图 18-20 输入 并 调整 文字 图 18-21 设置 参数 


输入 文字 “全 国 包 邮 ”， 按 Cul+Enter 组 合 键 确认 输入 ， 切 换 至 移动 工具 ， 根 
据 需 要 适当 地 调整 文字 的 位 置 ， 效 果 如 图 18-22 所 示 。 


双击 “全 国 包 邮 ”文字 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “图 案 倒 加 ” 复 
选 框 ， 选 择 释 加 图 案 ， 如 图 18-23 所 示 。 
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图 18-22 输入 并 调整 文字 图 18-23 ”选择 又 加 图 案 


由 于 朋友 圈 图 片 广告 的 区 域 不 大 ， 因 此 在 其 中 添加 文字 和 图 片 元 素 时 ,一 定 要 注意 
颜色 和 字体 的 协调 ， 不 可 滥用 过 多 的 颜色 和 字体 ， 以 免 消 费 者 产生 视觉 疲 苏 。 例 如 ， 很 
多 微 商 喜欢 采用 非常 艳丽 的 颜色 来 吸引 消费 者 眼球 ， 这 种 设计 看 上 去 虽然 很 有 视觉 冲击 
力 ， 其 实 很 难 提升 商品 的 转化 率 。 
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选中 “投影 ” 复 选 框 ,设置 “不 透明 度 ” 为 37%、“ 距 离 ”为 5 像素、“ 大 小 ” 
为 5 像素， 如 图 18-24 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 即 可 完成 对 文字 的 设置 ， 如 图 18-25 所 示 。 


千 适 轻便 


新 建 样式 0W)…  ) 
P8v8(v) 


图 18-24 设置 参数 图 18-25 ”查看 效果 


按 CtltO 组 合 键 打开 “文字 .psd ”素材 图 像 ， 运 用 移动 工具 将 其 拖 暇 至 背 
景 图 像 编 辑 窗 口中 的 合适 位 置 ， 效 琳 如 图 18-26 所 示 。 

按 Cal+O 组 合 键 打开 “和 斜 线 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 忠 至 育 
景 图 像 编辑 窗口 中 的 合适 位 置 ， 效 果 如 图 18-27 所 示 。 
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图 18-26 Rei X Ps 图 18-27 拖 忠 斜 线 素材 


18.2， 珠宝 首饰 产品 广告 设计 


在 新 媒体 商务 活动 中 ， 画 册 在 企业 形象 推广 和 产品 营销 中 的 作用 越 来 越 重要 。 本 实例 制 
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作 的 古 一 个 珠宝 企业 小 程序 的 画册 广告 ,为 了 增强 顾客 高 档 、 享 受 等 体验 ， 在 设计 时 使 用 了 
一 些 独 特 的 元 素来 体现 珠宝 的 品质 。 
本 实例 最 终 效果 如 图 18-28 所 示 。 


图 18-28 ”实例 效果 


扫 — Ja 观看 在 线 视频 . 
珠宝 首饰 产品 广告 设计 


18.2.1 制作 珠宝 广告 背景 效果 DD 


珠宝 画册 背景 以 红色 为 整体 色调 ， 并 在 其 中 添加 了 各 种 金色 和 银色 的 珠宝 饰品 素材 ， 真 
正 地 体现 出 一 种 高 贵 感 ， 有 具体 操作 方法 如 下 。 

E: Ctrl+O 组 合 键 ， 打 开 一 幅 素 材 图 像 ， 如 图 18-29 所 示 。 

按 Ctrl+O 组 合 键 ， 打开“ 栅 带 .psd” 素 材 ， 使 用 移动 工具 将 素材 图 像 拖 中 至 
冰冰 图 像 编辑 窗口 中 ， 效 朱 如 图 18-30 所 示 。 

双击 “飘带 ”图 层 ， 在 弹出 的 对 话 框 中 选中 “外 发 光 ” 复 选 框 ， 设置“ 发 光 颜 
色 ”RGB 参数 值 分 别 为 255、255、190, 设置 其 他 参数 如 图 18-31 所 示 。 
设置 完毕 后 ,， 单 击 “人 确定” 按钮， 为 图 像 添 加 图 层 梓 式 ， 效 来 如 图 18-32 所 示 。 
按 Ctrl+O 组 合 键 ,打开 “珠宝 .psd” 素 材 ， 使 用 移动 工具 将 素材 图 像 拖 电 至 
冰冰 图 像 编辑 窗口 中 ， 效 朱 如 图 18-33 所 示 。 

双击 “珠宝 ”图 层 ， 在 弹出 的 对 话 框 中 选中 “外 发 光 ” 复 选 框 ， 设 置 “发 光 颜 
色 ”RGB 参数 值 分 别 为 233S、255、190， 再 设置 其 他 参数 如 图 18-34 所 示 。 


| 完全 操作 手册 
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设 站 完毕 后 ， 单 击 “ 确 定 ” 按钮， 为 图 像 闪 加 图 层 杆 怀 ， 效 未 如 图 18-35 所 示 。 


<< v< W BBA l h iseyt Ë 


09 和 打开 k Mh psd 素材， 将 素材 图 像 分 别 拖 电 至 背景 


Iz: ET meus mat. 打开 “ 星 点 psd” 素 材 ， 将 素材 图 像 拖 中 至 背景 图 像 编 辑 


3 42 woo 688. 打开 “星星 jpg” 素 材 ， 将 素材 图 像 拖 电 至 背景 图 像 编辑 


q 13| 设置 “图 层 4” 图 层 的 混合 模式 为 “ 滤 色 ”， 效 果 如 图 18-41 所 示 。 
EZ. 314 复制 “图 层 4” 图 层 多 次 ， 根 据 需 要 对 各 图 像 的 大 小 、 位 置 、 角 度 和 方向 进行 
适当 地 调整 效果 如 图 18-42 所 示 。 
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新 媒体 运营 者 只 有 注重 视觉 设计 ， 才能 保证 良好 的 视觉 营销 效果 。 基 本 的 视觉 图 形 
党 区 可 分 为 二 大 过 宣 ，。 PS. S. W. 
@ 点 ， 属 于 最 简单 的 视觉 图 形 ， 当 它 被 合理 运用 时 就 能 产生 良好 的 视觉 效果 。 
@ 线 和 点 不 同 的 地 万 在 于 ， 线 构成 的 视觉 效果 是 流动 性 的 ， 富 有 动感 。 
@ 面 是 点 放大 后 的 呈现 形式 ， 通 第 可 以 分 为 各 种 不 同形 状 ， 如 三 角形 、 正 方形 和 辆 
形 等 ， 还 可 以 是 不 规则 的 形状 。 
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和 
选取 横 排 文字 工具 ， 展 开 “ 字 符 ” 面板， 设置 “颜色 ”为 日 色 ， 再 设置 其 他 选 
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项 如 图 1 8-43 所 示 。 
在 图 像 编 辑 窗口 中 的 合适 位 置 输入 所 需 的 文字 ， 效 末 如 图 18-44 所 示 。 
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| 6 国 a 2< rh ú 
美国 英语 I DE. | 
图 18-43 展开 “字符 ”面板 图 18-44 输入 文字 


复制 “my love” 两 次 ， 根 据 需 要 调整 文字 的 位 置 、 大 小 和 方 同 ， 效 果 如 
图 | 18-42 所 示 。 


图 18-45 复制 并 调整 文字 


使 用 横 排 文字 工具 在 图 像 编 辑 窗 口 porbelm 
点 ， 展 开 “ 字 符 ” 面 板 ， 设 置 “ 字 体系 列 ” 为 “华文 隶书 ”、“ 字 体 大 小 为 7 点 、 设 
所 选 字符 的 字 距 调整 ， 为 100、“ 颜 色 ” 为 粉红 色 (RGB 参数 值 分 别 为 255、197、215)， 如 
图 18-46 所 示 。 | x x u 
在 图 像 编辑 窗口 中 的 合适 位 置 输入 所 需 的 文字 ， 效果 如 图 18-47 所 示 。 
复制 并 调整 文字 ， 本 实例 制作 完毕 ， 效 果 如 图 18-48 所 示 。 
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图 18-46 ”设置 字符 参数 18.47 输入 文字 
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图 18-48 复制 并 调整 文字 


知识 导读 


H5 是 伴随 着 移动 互联 网 兴起 的 一 种 新 型 广告 工具 ， 具 有 很 多 移动 互联 网 的 
广告 优势 ， 如 娱乐 化 、 雁 片 化 、 社 会 化 以 及 互动 性 强 等 。 可 以 说 ，H5 技术 的 成 
熟 ， 不 但 为 移动 互联 网 开辟 了 一 种 全 新 的 广告 推广 方式 ， 同 时 也 推动 了 基于 移 
动 互联 网 的 新 媒体 广告 的 快速 发 展 。 


本 章 重点 导航 


婚礼 请 束 H5 页 面 设计 
O 汽车 品牌 推广 H5 页 面 设计 
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19.1 ”婚礼 请 束 H5 页 面 设计 


婚礼 请 束 是 新 人 在 举办 婚礼 时 逆 请 双方 各 自 的 亲朋 好 友 来 参加 婚礼 时 所 发 出 的 一 种 惑 请 
书 ， 是 即将 结婚 的 新 人 所 印 制 的 邀请 国 。 但 随 着 时 代 的 进步 ， 以 及 杀 朋 好 友 们 可 能 都 不 在 同 
一 个 城市 ， 隔 着 很 远 的 距离 ， 纸 质 印 制 的 邀请 国 已 不 如 互联 网 方便 快捷 ， 这 便 是 婚 包 请 柬 H5 
页 面 设计 具有 的 价值 优势 。 

本 实例 最 终 效 果 如 图 19-1 所 示 。 


图 19-1 实例 效果 


扫 一 扫 观 看 在 线 视频 . 
婚礼 请 东 H5 界面 设计 


19.1.1 设计 婚礼 请 束 主 题 背景 效果 


在 进行 婚礼 请 束 背景 的 设计 时 ， 运 用 适当 的 背景 色彩 及 各 种 元 素 的 合理 搭配 ， 既 可 以 突 
出 爱情 的 主题 ， 又 能 够 彰显 出 自身 婚礼 的 特色 ， 下 面 详细 介绍 设计 婚礼 请 柬 主题 背景 效果 的 
方法 。 

选择 “文件 ” |“ 新建” 命令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设 置 “名 称 ” 为 “ 婚 


—......IN270 


— 


H5 设计 
at 婚礼 请 束 与 品牌 推广 设计 


礼 请 柬 H5 界面 设计 ”、“ 宽 度 ” 为 1080 像素 、“ 高 度 ” 为 1920 像素 、“ 分 辨 率 ”为 300 
像素 / 英寸 、“ 颜 色 模 式 ” 为 “RGB 颜色 ”、“ 背 景 内容 ” 为 “白色 ”， 如 图 19-2 所 示 ， 单 
击 “ 创 建 ” 按 钮 ， 新 建 一 个 空白 图 像 。 

设置 前 景色 的 颜色 为 粉红 色 (RGB 参数 值 分 别 为 254、207、208)， 效 果 如 
图 19-3 所 示 。 
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图 19-2 新 建 空白 文档 图 19-3 ”设置 前 景色 


新 建 “图 层 1” 图 层 ， 按 Alt+Delete 组 合 键 填充 颜色 ， 效 果 如 图 19-4 所 示 。 
按 CtrltO 组 合 键 ， 打 开 “ 爱 心 背 景 psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 电 
至 背景 图 像 编 辑 窗口 中 ， 效 果 如 图 19-5 所 示 。 


图 19-4 填充 青 景 图 层 图 19-5 拖 忠 素材 图 像 
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在 “图 层 ”面板 中 ， 选 中 “图 层 1” 图 层 , 设置 图 层 “ 不 透明 度 ” 为 50%， 效 
傈 如 图 19-6 所 示 。 

按 CtrltO 组 合 键 ， 打 开 “ 新 人 模特 .psd” 素 材 图 像 ， 运 用 移动 工具 将 素材 图 
像 拖 虹 至 图 像 编 辑 窗 口中 ， 适当 地 调整 图 像 大 小 及 位 置 ， 效 果 如 图 19-7 所 示 。 
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图 19-6 ”设置 不 透明 度 效 果 图 19-7 拖 上 忠 人 物 素材 
19.1.2 ”设计 婚礼 请 柬 文 本 和 矩形 效果 2 


根据 婚礼 请 束 主题 背景 的 粉色 色彩 ， 在 设计 婚礼 请 束 文本 矩形 时 ， 运 用 白色 色彩 为 矩形 
进行 填充 ， 能 够 让 整个 页 面 烘 托 出 婚礼 的 幸福 感 ， 下 面 详细 介绍 设计 婚礼 请 束 文本 矩形 效果 
的 方法 。 

选取 工具 箱 中 的 矩形 工具 ， 在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “形状 ”、 
“填充 ”为 无 、“ 描 边 ” 为 白色 (RGB 参数 值 均 为 255)、“ 描 边 宽度 ”为 3 像素 ， 在 图 像 纺 
辑 窗 口中 的 适当 位 置 绘制 一 个 矩形 ， 效 果 如 图 19-8 所 示 。 


在 矩形 工具 属性 栏 中 设置 “填充 ”为 白色 (RGB 参数 值 均 为 233)、“ 描 边 ”为 
无 ， 得 到 “和 迭 形 2” 图 层 ， 效 果 如 图 19-9 所 示 。 
在 “图 层 ”面板 中 ， 按 住 Shift 键 的 同时 ， 选 中 “ 甜 形 1” $ü “EJE 2” 两 个 图 
层 ， 在 工具 属性 栏 中 ， 分 别 单 击 “ 水 平 居中 对 齐 ” 和 “垂直 居中 对 齐 ” 按 钮 ， 将 两 个 矩形 垂 
直 水 平 居中 ， 设 置 两 个 图 层 的 “不 透明 度 ”为 60%， 效 果 如 图 19-10 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “方正 


粗 宋 简体”、“ 字 体 大 小 ”为 66 点 、“ 设 置 所 选 字 符 的 字 距 调整 ”为 75、“ 颜 色 ” 为 黑色 (RGB 
参数 值 均 为 0)， 如 图 19-11 所 示 。 
— yy 
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H5 设计 
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| 册 61 sa 


图 19-9 得 到 “和 矩形 2” 图 层 
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图 19-10 ”调整 图 像 图 19-11 设置 字符 选项 


专家 指点 )) 
# Photoshop 工作 界面 中 ， 居 中 操作 可 以 通过 下 面 两 种 方式 实现 。 
@ 使 用 移动 工具 选中 需要 居中 的 两 个 图 后 ， 在 工具 属性 栏 单 击 “水 平 拓 中 ”按钮 
或 “垂直 居中 ”按钮 * ， 即 可 对 图 层 对 象 进行 水 平 或 垂直 居中 操作 。 
@ 选中 两 个 图 层 , 选择 “图 层 ”|“ 对 齐 ”| “水平 居 中 ”命令 , 也 可 以 水 平 居 中 图 层 对 象 。 
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输入 相应 的 文字 ， 并 调整 至 适当 位 置 ， 效 果 如 图 19-12 所 示 。 

在 “图 层 ” 面 板 中 双击 文字 图 层 ， 在 弹出 的 “图 层 样式 ”对 话 框 中 ， 选 中 “ 描 
边 ” 复 选 框 ， 设 置 “大 小 ”为 3 像素 、“ 位 置 ” 为 “外 部 ”、“ 颜 色 ” 为 白色 RGB 参数 值 
均 为 255)， 如 图 19-13 所 示 。 


图 19-12 输入 文字 图 19-13 设置 “ 描 边 ” 图 层 样式 


选中 “投影 ” 复 选 框 ,设置 “混合 模式 ”为 “正片 稚 底 ”、“ 阴 影 颜色 ”为 黑 
色 、“ 不 透明 度 ”为 59%、“ 和 角度 ”为 90 度 、“ 距 离 ” 为 9 像素 ， 如 图 19-14 所 示 。 
单 击 “ 确 定 ”按钮 ， 添 加 相应 图 层 样式 ， 效 果 如 图 19-15 所 示 。 
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图 19-14 ”设置 “投影 ”图 层 样式 图 19-15 “添加 相应 图 层 样式 
按 Ctrl+O 组 合 键 ， 打开“ 文字 1psd ”素材 图 像 ， 运 用 移动 工具 将 其 拖 鼻 至 当 
前 图 像 编辑 窗口 中 的 合适 位 置 ， 效 采 如 图 19-16 所 示 。 
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按 Ctl+O 组 合 键 ， 打开“ 文字 2 psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 眼 至 当 
前 图 像 编辑 窗口 中 的 合适 位 置 ， 效 果 如 图 19-17 所 示 。 
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图 19-46 JEnUn xs] 图 19-17 最 终 效 果 


19.2， 汽 车 品牌 推广 H5 页 面 设计 
随 着 时 代 的 进步 ， 汽 车 已 经 从 生活 中 的 奢侈 品 逐 渐 转 变 为 必 人 备品， 同时 伴随 着 的 是 汽车 
品牌 的 增多 以 及 汽车 产品 的 面市 。 为 一 款 汽 车 设计 出 一 种 极 具 吸 引力 的 汽车 产品 HS 页面 效 
果 ， 能 够 大 大 地 推动 汽车 品牌 的 宣传 及 销量 ， 使 其 从 众多 竞争 品牌 中 脱颖而出 。 
本 实例 最 终 效 果 如 图 19-18 所 示 。 
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图 19-18 ”实例 效果 
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19.2.1 设计 汽车 产品 背景 页 面 效 果 | 
汽车 产品 的 页 面 设计 通常 采用 的 是 黑白 色调 ， 采 用 这 种 方式 不 仅 可 以 演 染 气氛 ， 而 且 还 

能 给 自身 的 品牌 带 来 一 种 神秘 感 。 下 面 详细 介绍 设计 新 品 发 布 背景 形状 效果 的 方法 。 

选择 “文件 ” |“ 新建” 命令 ， 弹 出 “新 建文 档 ” 对 话 框 ， 设 置 “名 称 ” 为 “ 汽 

车 产品 HS 页 面 设计 ”、“ 宽 度 ” 为 1080 像素 、“ 高 度 ”为 1920 像素 、“ 分 辩 率 ”为 300 

像素 /英寸 “颜色 模式 ”为 “RGB 颜色 ”、“ 背 景 内 容 ” 为 “白色 ”， 如 图 19-19 所 示 ， 

单 击 “ 创 建 ”按钮 ， 新 建 一 个 空白 图 像 。 


(最 近 使 用 项 已 保存 照片 打印 图 和 福 和 插图 Web 种 动 设备 脏 片 和 视频 
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1 由 下 一 上 
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`x 
万 向 画板 


贺 加 co 


图 19-19 新建 空 白文 档 

选择 工具 箱 中 的 渐变 工具 , 单 击 “ 渐 变 ” 色 块 , 即 可 弹出 “渐变 编辑 器 ”对 话 框 ， 
新 建 预 设 渐变 , 设置 渐变 颜色 0% 位 置 为 灰色 (RGB 参数 值 均 为 147)、50% 位 置 为 浅 灰 色 (RGB 
参数 值 均 为 251)、100% 位 置 为 灰色 (RGB 参数 值 分 别 为 135、131、131)， 如 图 19-20 所 示 。 

展开 “图 层 ”面板 ， 在 面板 下 方 单 击 “ 创 建新 图 层 ” 按 钮 ， 新 建 一 个 “图 层 1” 
图 层 , 并 选取 工具 箱 中 的 渐变 工具 , 在 图 像 编辑 窗口 中 , 由 上 至 下 拖 动 鼠标 填充 灰白 线性 渐变 ， 
效果 如 图 19-21 所 示 。 

选取 工具 箱 中 的 椭圆 工具 ,在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “形状 ”、“ 填 
充 ” 为 黑色 (RGB 参数 值 均 为 0)、“ 描 边 ”为 无 ， 在 图 像 编 辑 窗口 中 绘制 一 个 如 图 19-22 所 
示 的 椭圆 ， 得 到 “椭圆 1” 图 层 。 

按 CtrlHHT 组 合 键 ， 调 出 变换 控制 框 ， 适 当 调 整 图 像 大 小 及 位 置 ， 并 按 Enter 键 
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确认 调整 ， 效 末 如 图 19-23 所 示 。 


名 称 (N): BE 
渐变 类 型 :| 实 底 ~ 
平滑 度 (M): 100 < % 


不 醒 朋 度 : 9 全 前: % 是 除 (D) 


:BB mcm |% | WN) | 


图 19-20 ”设置 渐变 预 设 19-21 填充 线性 渐变 


图 19-22 ”绘制 椭圆 19-23 ”调整 图 像 


在 Photoshop 工作 界面 中 ， 如 果 需 要 调整 图 像 的 大 小 及 位 置 ， 可 以 选择 “编辑 ”|“ 自 
由 变换 ”命令 对 图 像 进行 调整 ， 运 用 移动 工具 可 以 对 图 像 进行 位 置 调 整 。 
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在 “图 层 ”面板 中 ,双击 “椭圆 1” 图 层 ， 弹 出 “图 层 样式 ”对 话 框 ， 选 中 “内 
发 光 ” 揽 选 框 ， 设 置 “ 混 合 模式 ”为 “正常 ”、“ 不 透明 度 ”为 100%、“ 杂 色 ” 为 0%、 设 
置 发 光 颜 色 为 白色 (RGB 参数 值 均 为 253)、“ 方 法 ”为 “精确 ”、“ 源 ”为 “边缘 ”、“ 阻 塞 " 
为 43%、“ 大 小 ”为 38 像素 、“ 范 围 ” 为 100%、“ 拌 动 ” 为 100%， 如 图 19-24 所 示 。 
单 击 “确定 ”按钮 ， 为 “ 椭 团 1” 图 层 添加 图 层 样式 ， 效 果 如 图 19-25 所 示 。 


图 19-24 设置 图 层 样式 图 19-25 “添加 图 层 样式 
19.2.2 设计 汽车 产品 框 染 页 面 效果 w. 


大 多 数 汽 车 产品 都 会 在 车 身 的 线条 上 下 功夫 ， 而 为 了 凸显 汽车 的 特色 ， 在 汽车 页 面 效 果 
的 设计 中 便 可 以 加 入 一 些 线条 框架 ， 既 能 够 增加 页 面 的 美观 度 ， 又 能 够 突出 产品 的 特色 。 下 
面 详细 介绍 设计 汽车 产品 界面 框架 效果 的 方法 。 

按 Ctrl+O 组 合 键 ， 打 开 “ 汽 车 psd” 素材 图 像 ， 将 所 选择 的 图 像 运用 移动 工 
具 拖 电 至 图 像 编 辑 窗口 中 ， 得 到 “汽车 ”图 层 ， 效 末 如 图 19-26 所 示 。 

按 Ctrl+T 组 合 键 ， 调 出 变换 控制 框 ， 适 当 调 整 图 像 的 大 小 及 位 置 ， 按 Enter Bë 
确认 变换 ， 效 果 如 图 19-27 所 示 。 

选取 工具 箱 中 的 矩形 工具 ,在 工具 属性 栏 中 设置 “选择 工具 模式 ”为 “形状 ”、“ 填 
充 ” 为 黑色 (RGB 参数 值 均 为 0)、“ 摘 边 ” 为 黑色 (RGB 参数 值 均 为 0)、“ 宽 度 ” 为 1 像素 ， 
在 图 像 编 辑 窗口 中 绘制 一 个 如 图 19-28 所 示 的 和 矩形， 得到“ 甜 形 1” 图 层 。 

在 图 像 编 辑 窗口 中 ， 选 中 “年 形 1” 图 层 所 对 应 的 图 像 ， 按 住 Alt 键 的 同时 ， 
用 鼠标 左 键 拖 中 图像 ， 复 制 得 到 “ 秆 形 1 拷贝 ”图 层 ， 效 果 如 图 19-29 所 示 。 
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图 19-26 HFE 19-27 调整 图 像 


图 19-28 绘制 矩形 图 19-29 ” 拖 忠 复制 图 像 


S 2 Fa 


在 Photoshop 工作 界面 中 ，Shift 键 在 设计 或 修 图 时 的 实用 功能 有 很 多 种 。 

@ 绘制 直线 : 按 住 Shift 键 ， 抑 动 鼠 标 可 以 强制 笔触 沿 水 平 或 者 垂直 方向 活动 。 
@ 移动 图 像 : 按 住 Shift 键 ， 抑 动 图 像 可 以 让 图 像 进行 水 平 或 者 垂直 方向 的 移动 。 
@ 执行 强制 比例 : 在 缩放 图 形 时 ， 按 住 Shift 键 ， 会 按照 图 像 的 原 比 例 进 行 缩放 。 


279.L -一 


WERE 


新 媒体 美工 ms >>> 
完全 操作 手册 


按 Ctrl+T 组 合 键 ， 调 出 变换 控制 框 ， 在 工具 属性 栏 中 设置 “旋转 ”为 -90 度 ， 
适当 调整 图 像 的 大 小 及 位 置 ， 效 朱 如 图 19-30 所 示 。 

在 图 像 编 辑 窗 口中 ， 选 中 “定形 1 DL” 图 层 所 对 应 的 图 像 ， 按 住 ShifttAlt 
组 合 键 ， 同 时 用 鼠标 磊 键 垂直 拖 捕 图 像 至 合适 的 位 十， 得 到 (EJE 1 拷贝 2 Ejs, X SA 
图 19-31 所 示 。 


图 19-30 调整 图 像 图 19-31 拖 忠 复制 图 像 


选中 “EJE 1” 图 层 所 对 应 的 图 像 ， 按 住 ShiftrAlt 组 合 键 ， 同 时 用 鼠标 左 键 水 
平 拖 鼻 图 像 至 合适 的 位 鼻 ， 得 到 (EJE 1 拷贝 3 图 层 ， 效 未 如 图 19-32 所 示 。 
按 CtrltT 组 合 键 , 调 出 变换 控制 框 , 适当 调整 图 像 的 大 小 , 效果 如 图 19-33 所 示 。 


图 19-32 拖 忠 复制 图 像 19-33 调整 图 像 
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rH “EJE 1 拷贝 3” 图 层 所 对 应 的 图 像 ， 按 住 Shift+Alt 组 合 键 ， 同 时 用 鼠标 
左 键 垂直 拖 殷 图 像 至 合适 的 位 置 ， 得 到 “和 窍 形 1 斤 贝 4 图 层 ， 效 朱 如 图 19-34 所 示 。 
步骤 按 CtrlHT 组 合 键 , 调 出 变换 控制 框 , 适当 调整 图 像 的 大 小 , 效果 如 图 19-35 所 示 。 


图 19-34 ” 拖 电 复制 图 像 图 19-35 ”调整 图 像 
19.2.3 设计 汽车 产品 文字 修饰 效果 DD 


设计 汽车 产品 的 推广 页 面 时 ， 一 定 要 注意 保持 页 面 简 洁 ， 不 必 透 露 过 多 的 信息 ， 要 为 产 
品 保持 神秘 感 ， 让 人 有 疑惑 感 ， 勾 起 人 们 的 兴趣 。 下 面 详细 介绍 设计 汽车 产品 界面 框架 效果 
的 方法 。 

选取 工具 箱 中 的 横 排 文 字 工 具 ， 选择 “窗口 ”|“ 字 符 ” 命 令 ， 在 弹出 的 “字符 ” 
面板 中 , 设置 “字体 系列 ”为 “ 创 艺 繁 来 书 ”、“ 字 体 大 小 ”为 64 点 、“ 颜 色 ” 为 黑色 (RGB 
参数 值 均 为 0)， 参 数 如 图 19-36 所 示 。 
输入 相应 文字 ， 并 调整 至 合适 的 位 置 ， 效 果 如 图 19-37 所 示 。 
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图 19-36 设置 字体 系列 19-37 输入 相应 文字 
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选取 工具 箱 中 的 横 排 文字 工具 ,选择 “窗口 ”| “字符 ”命令 ， 在 弹出 的 “字符 ” 
面板 中 ， 设 置 “字体 系列 ”为 “黑体 ”、“ 字 体 大 小 ”为 18 点 、“ 颜 色 ” 为 黑色 (RGB 参数 
值 均 为 0)， 参 数 如 图 19-38 所 示 。 

输入 相应 文字 ， 并 调整 至 合适 的 位 置 ， 效 果 如 图 19-39 所 示 。 


一 


长 沙 旗 下 30 家 门店 


ra 


图 19-38 ”设置 字符 选项 图 19-39 输入 文字 


选取 工具 箱 中 的 横 排 文字 工具 ,选择 “窗口 ”| “字符 ”命令 ， 在 弹出 的 “字符 ” 
面板 中 ， 设 置 “字体 系列 ”为 “黑体 ”、“ 字 体 大 小 ”为 38 点 、“ 颜 色 ” 为 黑色 (RGB 参数 
值 均 为 0)， 激 话 仿 粗 体 图 标 ， 如 图 19-40 所 示 。 

输入 相应 文字 ， 并 调整 至 合适 的 位 置 ， 效 果 如 图 19-41 所 示 。 
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图 19-40 ”设置 字符 选项 图 19-41 输入 文字 


展开 “图 层 面板 ,在 汽车 图 层 上 方 新 建 一 个 “图 层 2 图 层 ， 如 图 19-42 所 示 。 
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2808 选中 “图 层 2” 图 层 ， 设 置 前 景色 为 白色 (RGB 参数 值 均 为 255)， 选 取 工 具 箱 
中 的 画笔 工具 , 在 工具 属性 栏 中 设置 “大 小 ”为 200 像素 、“ 模 式 ” 为 “正常 ”、“ 不 透明 度 ” 
为 100%、“ 流 量 为 100%、“ 平 请 ”为 10%， 在 如 图 19-43 所 示 的 两 个 位 置 涂抹 两 个 日 斑 。 
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图 19-42 ”新 建 图 层 19-43 ”涂抹 画笔 


在 “图 层 ”面板 中 ， 设 置 “ 图 层 2” 图 层 的 “混合 模式 ”为 “线性 光 ”， 如 


图 19-44 所 示 。 
选择 “ 滤 镜 ”| 模糊 | 径 加 模糊 命令, 弹出 “ 径 癌 模糊 ”对 话 框 , 设置 “ 数 
EL” 为 100. “模糊 方法 ” 为 “缩放 ” . “Pi S" 为 “g š 如 图 19-45 p. 
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图 19-44 ”设置 混合 模式 图 19-45 设置 参数 
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单 击 “确定 ”按钮 ， 为 “图 层 2” 图 层 添 加 滤 锐 ， 效 末 如 图 19-46 所 示 。 
按 CtrltT 组 合 键 , 调 出 变换 控制 框 ， 适当 调整 图 像 的 大 小 及 位 置 ， 效 采 如 


图 19-47 所 示 。 


在 “图 层 ” 面 板 中 ,选中 “汽车 ” 


图 层 ， 选 择 “ 图 像 ”|“ 调 整 ”|“ 曲 线 ”命令 ， 


弹出 “曲线 ”对 话 框 , 在 曲线 上 单 击 鼠标 左 键 新 建 一 个 控制 点 , 在 下 方 设置 输入 为 206、 输 


出 ”为 162， 如 图 19-48 所 示 。 


长 沙 旗下 30 家 门店 
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图 19-46 ”添加 滤 镜 效果 


完成 汽车 产品 H5 页 面 设计 。 
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图 19-48 设置 曲线 
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图 19-47 ”调整 图 像 效果 


单 击 “ 确 定 ” 按 钮 , 即 可 调整 “汽车 ”图 像 的 色 阶 , 效果 如 图 19-49 所 示 。 至 此 ， 


长 沙 旗下 30 家 门店 


长 沙 到 代 


图 19-49 调整 图 像 色 阶 
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现 如 今 ， 伴 随 着 微 信 的 火热 发 展 ， 微 信 公 人 砍 号 、 小 程序 也 相应 诞生 。 越 来 
越 多 的 商家 、 人 企业、 个 人 都 申请 开通 了 微 信 账号 ， 用 于 营销 或 者 其 他 用 途 。 本 
章 主 要 介绍 短信 朋友 圈 、 公 人 欢 号 、 小 程 厚 的 设计 条例 方法 。 
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20.1” 修 图 APP 活动 海报 设计 


今 ， 随 着 手机 拍照 和 修 图 功能 越 来 越 强大 ， 大 家 拍 完 照片 都 会 修一 修 ， 再 分 享 到 朋友 
图 中 ， 因 此 修 图 APP 成 为 爱 拍照 人 士 的 必 装 应 用 小 程序 。 本 节 主 要 介绍 一 个 修 图 APP 的 首 
页 VIP 会 员 推广 广告 ， 这 则 广告 整体 采用 暗色 调 的 界面 设计 ， 彰显 出 高 贵 、 华 丽 的 视觉 效果 。 

本 实例 最 终 效 果 如 图 20-1 所 示 。 
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图 20-1 实例 效果 
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20.1.1 ”制作 VIP 推广 背景 效果 


— VIP 4E] ñ 2 BJ z, 
1| 按 Ctrl+O 组 合 键 ， 打 开 一 幅 素材 图 像 ， 如 图 20-2 所 示 。 
— 选取 工具 箱 中 的 裁剪 工具 ， 设 置 长 宽 比 为 720 : 480， 适 当 调 整 裁剪 范围 ， 如 
20-3 所 示 。 
按 Enter 键 确认 裁剪 ， 效 果 如 图 20-4 所 示 。 
选择 “ 滤 镜 ”|“Camera Raw 滤 镜 ”命令 ， 弹 出 Camera Raw 对 话 框 ， 如 
20-5 wa 

05 切换 至 “镜头 校正 ”选项 卡 ， 在 “ 晤 影 ” 选 项 区 中 设置 “数量 ”为 -100， 添 
加 学 1 如 图 20-6 所 示 。 
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切换 至 “效果 ”选项 卡 ， 在 “裁剪 后 学 影 ” 选 项 区 中 设置 “数量 ”为 -100， 


蝇 化 暗 角 效 霖 ， 如 图 20-7 所 示 。 
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图 20-6 ”添加 晤 影 效 果 图 20-7 强化 暗 角 效果 


切换 至 “基本 ”选项 卡 ， 设置 “自然 饱和 度 ” 为 28， 增 加 画面 的 色彩 浓度 ， 
效果 如 图 20-8 所 示 。 
单 击 “确定 ”按钮 ， 应 用 Camera Raw 滤 镜 调整 ， 效 果 如 图 20-9 所 示 。 
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20-8 ”增加 画面 饱和 度 图 20-9 ”应 用 Camera Raw 滤 镜 效果 


20.1.2 制作 VIP 推广 主体 效果 | 
下 面 介 绍 制作 VIP 推广 主体 效果 的 方法 。 
选取 工具 箱 中 的 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 蓝 色 (RGB 参数 值 
分 别 为 0、160、233)、“ 描 边 ”为 无 ， 绘 制 一 个 矩形 图 形 ， 效 果 如 图 20-10 所 示 。 
在 “图 层 ”面板 中 , 设置 “矩形 1” 图 层 的 “不 透明 度 ”为 80%, 如 图 20-11 所 示 。 


EE Es 路径 
pam ~v m Q@ TH ËB 
正常 v| 必要 明度 :80% | > 
谈 定 : 图 A + TE 自 填充 : 00% ~ 


图 20-10 ”绘制 矩形 图 形 图 20-11 ji 8 A BH E 


执行 操作 后 ， 即 可 改变 矩形 图 形 的 不 透明 度 效果 ， 如 图 20-12 所 示 。 
在 “图 层 ” 面 板 中 ， 复 制 “ 和 矩形 1” 图 层 ， 得 到 “和 矩形 1 拷贝 ”图 层 ， 如 
图 20-13 所 示 。 
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如 果 要 同时 处 理 多 个 图 质 中 的 内 容 (如 移动 、 应 用 变化 或 创建 剪贴 莹 版 )， 可 以 将 这 
些 图 技 链接 在 一 起 。 选 择 两 个 或 多 个 图 层 ， 然 后 选择 图 后 | 链接 图 技 命令 或 单 击 图 
层 面板 底部 的 “链接 图 层 按钮 留 ,都 可 以 将 选择 的 图 技 链接 起 来 。 如 果 要 取消 链接 ， 
可 以 选择 其 中 一 个 链接 图 层 ， 然 后 单 击 “ 链 接 图 层 ”按钮 9 ， 即 可 取消 链接 。 
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图 20-12 图像 的 不 透明 效果 图 20-13 复制 图 层 


按 Ctrl+T 组 合 键 ， 调 出 变换 控制 框 ， 适 当 调整 息 形 图 像 的 大 小 和 位 置 ， 效 二 
如 图 20-14 所 示 。 

选取 工具 箱 中 的 矩形 工具 ， 在 工具 属性 栏 中 设置 “填充 ”为 无 、“ 描 边 ” 为 日 
色 (RGB 参数 值 均 为 255)、“ 描 边 宽度 ”为 1 像素 ， 效 果 如 图 20-15 所 示 。 


图 20-14 ”调整 矩形 图 像 图 20-15 调整 图 像 效 果 


按 Ctrl+O 组 合 键 ， 打 开 “ 彩 带 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 忠 至 当 
前 图 像 编辑 窗口 中 的 合适 位 置 ， 效 果 如 图 20-16 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 , 在 “字符 ”面板 中 设置 “字体 系列 ”为 “Modem 
No.20”、“ 字 体 大 小 ”为 111 点 、 “颜色 ”为 黄色 (RGB 参数 值 分 别 为 241、182、79)， 激 
活 仿 粗 体 图 标 ， 如 图 20-17 所 示 。 
输入 相应 的 文本 ， 调 整 至 适当 位 置 ， 效 果 如 图 20-18 所 示 。 
在 “图 层 ” 面 板 中 双击 文字 图 层 ， 在 弹出 的 “图 层 样式 ”对 话 框 中 ， 选 中 “和 斜 
面 和 浮雕 ” 复 选 框 ， 设 置 “ 大 小 ”为 10 像素 、“ 和 角度 ”为 90 度 、“ 高 度 ” 为 30 度 ， 如 
图 20-19 所 示 。 


289 -一 


WERE 


HIS AKSES T Y wa — ee > 
|j=—`bəDƏÀÚl— 


44 x 
= FE = 
| RPR na: Fanpunan an i 
| Modern No. 20 x Regular v | 
| : | 
下 111 点 v 12 (自动 vJ! 
IVA v| Wo -| 
| 本 #&— | 
| ie | 
ew 上 x 
| | 
ITT 100% K. 100% | 
Ao | | 
| mm | 
工 T, Ah = x 
L 


图 20-18 输入 文字 图 20-19 设置 “斜面 和 浮雕 ”参数 


选中 “投影 ” 复 选 框 ， 相 关 参 数 设 置 如 图 20-20 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 添 加 相应 的 图 层 样式 ， 效 果 如 图 20-21 所 示 。 
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图 层 按 这 投影 


图 20-20 设置 “投影 ”参数 图 20-21 添加 图 层 样式 
22.3 13| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “经 典 
粗 宋 简 ”、“ 字 体 大 小 ”为 31 点 、 “颜色 为 日 色 (RGB 参数 值 均 为 233)， 如 图 20-22 所 示 。 
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输入 相应 的 文字 ， 调 整 至 适当 位 置 ， 效 果 如 图 20-23 所 示 。 
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置 》50 个 商业 修 图 教学 视频 


图 20-22 设置 字 稚 属性 图 20-23 输入 文字 


按 Ctrlt+O 组 合 键 打开“ 底 纹 . psd” 素材 图 像 ， 运 用 移动 工具 将 其 拖 电 至 当 
"al 口中 的 合适 位 置 ， 效 果 如 图 20-24 所 示 。 

16| 选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “华文 
"s ' g yes 为 25 点 、“ 颜 色 ” 为 黑色 (RGB 参数 值 均 为 0)， 激 活 仿 粗 体 图 标 ， 输 
入 相应 的 文字 ， 效 果 如 图 20-25 所 示 。 


V Í 于》 50 个 商业 修 图 教学 视频 》50 个 商业 位 图 教学 视频 


图 20-24 拖 抱 底 纹 素材 图 20-25 输入 文字 


游戏 APP 启动 宣传 页 设计 


， 手 机 游戏 呈现 全 面 繁荣 的 发 展 趋 势 ， 而 且 玩 家 对 于 游戏 画面 的 审美 观 和 交互 形式 
fe peer 界面 是 否 美 观 ， 操 作 是 否 顺 手 ， 这 些 都 是 决定 玩家 对 游戏 产生 兴趣 的 关 
键 因 素 。 对 于 游戏 民 来 说 ,界面 画 风 、 操 作 流 程 以 及 交互 体验 等 设计 要 素 ， 都 是 设计 者 需 
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要 重点 考虑 的 范畴 。 
本 实例 介绍 的 是 一 个 游戏 APP 的 启动 界面 微 网 页 ， 通 过 微 网 页 进行 宣传 ， 可 以 将 其 很 好 
地 与 微 信 等 社交 媒体 相 结合 ， 扩 大 游戏 APP 的 宣传 面 ， 让 更 多 玩家 了 解 和 试 玩 。 
本 实例 最 终 效 果 如 图 20-26 所 示 。 
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图 20-26 ”实例 效果 


扫 一 扫 观 看 在 线 视频 . 
游戏 启动 APP 宣传 页 设计 


20.2.1 制作 游戏 宣传 背景 效果 


下 面 介绍 制作 游戏 APP 局 动 宣传 页 背景 效果 的 方法 。 

选择 “文件 ”| “新建 ” 命令 , 弹出 “新 建文 档 ” 对话 框 , 新 建 一 幅 RGB 模式 图 像 ， 
相关 设置 如 图 20-27 所 示 。 
按 Ctrl+O 组 合 键 ， 打 开 “ 游 戏 画面 jpg” 素 材 图 像 ， 如 图 20-28 所 示 。 
选择 “图 像 ”|“ 调 整 ”|“ 亮 度 / 对比度” 命令， 弹出 “亮度 / 对比度” 对话 框 ， 
设置 “亮度 为 10、“ “对比度 为 22， 如 图 20-29 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 调 整 图 像 的 亮度 和 对 比 度 ， 效 果 如 图 20-30 所 示 。 
选择 “图 像 ”| "调整 "| 自然 饱和 度 ” 命令 , 弹出 “自然 饱和 度 ” 对话 框 , 设置 “ 自 
然 包 和 度 ” 为 50、“ 饱 和 度 ” 为 8， 如 图 20-31 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 调 整 画面 的 色彩 饱和 度 ， 效 果 如 图 20-32 所 示 。 
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图 20-27 新 建 空白 文档 
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图 20-29 设置 “亮度 /对 比 度 ” 参 妆 


20-32 ”调整 饱和 度 效 果 


图 20-31 设置 “自然 饱和 度 ” 参 数 
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使 用 “亮度 /对比度 ”命令 可 以 对 图 像 的 色彩 进行 简单 的 调整 ， 它 对 图 像 的 每 个 像素 
都 可 以 进行 同样 的 调整 。 “亮度 /对比 度 ” 命 令 对 单个 通道 不 起 作用 ， 所 以 该 调整 方法 不 
适用 于 高 精度 输出 。 


运用 移动 工具 将 游戏 画面 拖 卡 至 背景 图 像 编辑 窗口 中 的 合适 位 置 ， 效 果 如 
图 20-33 所 示 。 

按 CaltT 组 合 键 ， 调 出 变换 控制 框 ， 适 当 调 整 游戏 画面 的 大 小 和 位 置 ， 效 末 
如 图 20-34 所 示 。 


图 20-33” 拖 忠 图 像 图 20-34 调整 图 像 


选取 工具 箱 中 的 渐变 工具 , 调 出 “渐变 编辑 器 ” 对 话 框 , 设置 渐变 色 为 红色 (RGB 
参数 值 分 别 为 186、0、4) 到 透明 色 ， 如 图 20-35 所 示 。 
新 建 “ 图 层 2? 图 层 , 运 用 渐变 工具 从 下 至 上 填充 线性 渐变 , 效果 如 图 20-36 所 示 。 
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图 20-36 填充 线性 渐变 
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20.2.2 制作 游戏 宣传 主体 效果 JU 


下 面 介 绍 制作 游戏 APP 启动 宣传 界面 微 网 页 主体 效果 的 方法 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “长 城 
行 楷体 ”、“ 字 体 大 小 ”为 200 点 、“ 设 置 所 选 字符 的 字 距 调整 ”为 -200、“ 颜 色 ” 为 浅 蓝 
色 (RGB 参数 值 分 别 为 225、255、255)， 激 活 仿 粗 体 图 标 ， 如 图 20-37 所 示 。 

输入 相应 的 文字 ， 适 当 调 整 其 位 置 ， 效 果 如 图 20-38 所 示 。 
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图 20-37 ”设置 字符 属性 图 20-38 输入 文字 


A Photoshop 中 ， 在 英文 输入 法 状态 下 ,， 按 工 键 ， 也 可 以 快速 切换 至 横 排 文字 工具 ， 
然后 在 图 像 编 辑 窗 口中 输入 相应 文本 内 容 即 可 ， 如 果 输 入 的 文字 位 置 不 能 满足 用 户 的 需 
求 ， 此 时 用 户 可 以 通过 移动 工具 ， 将 文字 移动 到 相应 位 置 即 可 。 


在 “图 层 ” 面 板 中 双击 文字 图 层 ， 在 弹出 的 “图 层 样式 ”对 话 框 中 ， 选 中 “ 渐 
变 释 加 ” 复 选 框 ， 单 击 “ 点 按 可 编辑 渐变 ”按钮 ， 弹 出 “渐变 编辑 器 ”对 话 框 ， 设 置 渐 变色 
为 红色 (RGB 参数 值 分 别 为 186、0、4) 到 白色 ， 将 白色 色 标 调整 至 80% 的 位 置 ， 如 图 20-39 
所 示 。 
单 击 “ 确 定 ” 按 钮 ， 返 回 “ 图 层 样式 ”对 话 框 ， 相 关 参 数 设置 如 图 20-40 所 示 。 
选中 “投影 ” 复 选 框 ， 相 关 参 数 设置 如 图 20-41 所 示 。 
单 击 “ 确 定 ” 按 钮 ， 添 加 相应 的 图 层 样式 效果 ， 如 图 20-42 所 示 。 
复制 文字 图 层 ， 适 当 调 整 其 位 置 ， 制 作 立 体 文字 效果 ， 如 图 20-43 所 示 。 
新 建 “图 层 3” 图 层 ， 运 用 和 矩形 选 框 工具 创建 一 个 矩形 选区 ， 如 图 20-44 所 示 。 
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图 20-39 ”设置 渐变 色 图 20-40 ”设置 “渐变 一 加 ”参数 
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图 20-41 设置 “投影 ”参数 图 20-42 添加 图 层 样式 效果 


图 20-43 ”制作 立体 文字 效果 图 20-44 ”创建 甜 形 选区 
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在 创建 选区 后 ， 为 了 防止 因 错 误 操作 而 造成 选区 丢失 ， 或 者 后 面 制作 其 他 效果 图 时 
还 需要 更 改选 区 ， 用 户 可 以 先 将 该 选区 保存 。 选 择 莱 单 栏 中 的 “选择 ”|“ 存 储 选区 ” 命 
令 ， 弹 出 “存储 选区 ”对 话 框 ， 在 弹出 的 对 话 框 中 设置 存储 选区 的 各 选项 ， 单 击 “ 确 定 ” 
按钮 后 即 可 存储 选区 。 


22309 选取 工具 箱 中 的 渐变 工具 ， 在 选区 中 间 至 四 周 填充 红色 (RGB 参数 值 分 别 为 
186、0、4) 到 透明 色 的 径 向 渐变 ， 并 取消 选区 ， 效 果 如 图 20-45 所 示 。 

选取 工具 箱 中 的 横 排 文字 工具 ， 在 “字符 ”面板 中 设置 “字体 系列 ”为 “微软 
雅 黑 ”、“ 字 体 大 小 ”为 30 点 、“ 颜 色 ” 为 浅 蓝 色 (RGB 参数 值 分 别 为 208、230、250)， 激 
话 仿 粗 体 图 标 ， 输 入 相应 文字 ， 效 果 如 图 20-46 所 示 。 
按 Ctrl+O 组 合 键 ， 打 开 “ 文 字 .psd” 素 材 图 像 ， 运 用 移动 工具 将 其 拖 蝶 至 当 
前 图 像 编辑 窗口 中 的 合适 位 置 ， 效 果 如 图 20-47 所 示 。 
按 Ctrl+O 组 合 键 ,打开 “按钮 psd” 素材 图 像 ， 运 用 移动 工具 将 其 拖 蝶 至 当 
部 图 像 编 辑 窗 口中 的 合适 位 置 ， 效 果 如 图 20-48 所 示 。 


图 20-45 ”填充 径 向 渐变 图 20-46 输入 相应 文字 图 20-47 ” 拖 曙 文字 素材 图 20-48 jem Els 
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